Questions tagged [enzyme]

Unit test library for React. It is developed by Airbnb. It can be used with other JavaScript testing frameworks like Mocha, Jest, Karma, etc.

Enzyme is a JavaScript testing utility for React that makes it easier to assert, manipulate, and traverse your React components' output.

Enzyme's API is meant to be intuitive and flexible by mimicking jQuery's API for DOM manipulation and traversal.

Enzyme is unopinionated regarding which test runner or assertion library you use and should be compatible with all major test runners and assertion libraries out there. The documentation and examples for Enzyme use Mocha and Chai, but you should be able to extrapolate to your framework of choice.

4320 questions
166
votes
4 answers

React Enzyme find second (or nth) node

I'm testing a React component with Jasmine Enzyme shallow rendering. Simplified here for the purposes of this question... function MyOuterComponent() { return (
... ... …
sfletche
  • 47,248
  • 30
  • 103
  • 119
163
votes
7 answers

How to make Jest wait for all asynchronous code to finish execution before expecting an assertion

I am writing an integration test for for a React application, i.e. a test that tests many components together, and I want to mock any calls to external services. The issue is that the test seems to execute before the async callback is executed…
Dan
  • 29,100
  • 43
  • 148
  • 207
158
votes
3 answers

how to change jest mock function return value in each test?

I have a mock module like this in my component test file jest.mock('../../../magic/index', () => ({ navigationEnabled: () => true, guidanceEnabled: () => true })); these functions will be called in render function of my component to…
pashaplus
  • 3,596
  • 2
  • 26
  • 25
158
votes
5 answers

eslint should be listed in the project's dependencies, not devDependencies

Either I don't understand dependencies vs. devDependencies in node 100% yet or eslint is just wrong here (not capable of analyzing this correctly): 3:1 error 'chai' should be listed in the project's dependencies, not devDependencies …
PositiveGuy
  • 17,621
  • 26
  • 79
  • 138
143
votes
9 answers

Simulate a button click in Jest

Simulating a button click seems like a very easy/standard operation. Yet, I can't get it to work in Jest.js tests. This is what I tried (and also doing it using jQuery), but it didn't seem to trigger anything: import { mount } from 'enzyme'; page =…
foobar
  • 3,849
  • 8
  • 22
  • 32
140
votes
5 answers

Is there an option to show all test descriptions when I run jest tests?

I'm using jest and enzyme with my create-react-app project. When I run npm test, I get an output that shows the names of the test files that passed but I'd like the output to also include the names of the tests. Example: Button.test.js it…
Sendai
  • 1,625
  • 2
  • 8
  • 14
135
votes
3 answers

When should you use render and shallow in Enzyme / React tests?

prior to posting this question, I tried to search in sqa stackexchange but I found no post about shallow and render there, so I hope someone can help me out here. When should I use shallow and render in testing react components? Based on the airbnb…
Cyval
  • 2,429
  • 4
  • 16
  • 27
125
votes
17 answers

Enzyme - How to access and set value?

I'm confused about how to access value when using mount. Here's what I've got as my test: it('cancels changes when user presses esc', done => { const wrapper = mount(); const input =…
ffxsam
  • 26,428
  • 32
  • 94
  • 144
111
votes
22 answers

ReferenceError: You are trying to `import` a file after the Jest environment has been torn down

I have a component that makes use of Animated component from react native. I started writing a test case to simulate onPress of a component, which calls a function that has Animated.timing in it, and setState. running jest works fine, but the tests…
nrion
  • 4,258
  • 4
  • 17
  • 33
102
votes
8 answers

Jest - how to test if a component does not exist?

How do I check if a component is not present, i.e. that a specific component has not been rendered?
JoeTidee
  • 24,754
  • 25
  • 104
  • 149
93
votes
10 answers

How to test a component using react-redux hooks with Enzyme?

I have a simple Todo component that utilizes react-redux hooks that I'm testing using enzyme but I'm getting either an error or an empty object with a shallow render as noted below. What is the correct way to test components using hooks from…
crowns4days
  • 963
  • 1
  • 6
  • 6
93
votes
8 answers

Jest, Enzyme: Invariant Violation: You should not use or withRouter() outside a

I have a which outputs one component and list of contacts presentated by . The problem is that in the test for when I try to mount it, test outputs an error Invariant Violation:…
Maria Piaredryj
  • 1,584
  • 3
  • 16
  • 35
92
votes
4 answers

Difference between enzyme, ReactTestUtils and react-testing-library

What is the difference between enzyme, ReactTestUtils and react-testing-library for react testing? The ReactTestUtils documentation says: ReactTestUtils makes it easy to test React components in the testing framework of your choice. The enzyme…
Black
  • 9,541
  • 3
  • 54
  • 54
85
votes
18 answers

Enzyme expects an adapter to be configured

I created a new React application by create-react-app and I wanted to write a unit test to a component named "MessageBox" that I created in the application. This is the unit test that I wrote: import MessageBox from "../MessageBox"; import {…
CrazySynthax
  • 13,662
  • 34
  • 99
  • 183
82
votes
3 answers

How to unit test a method of react component?

I am trying to unit test my reactjs component: import React from 'react'; import Modal from 'react-modal'; import store from '../../../store' import lodash from 'lodash' export class AddToOrder extends React.Component { constructor(props)…
bier hier
  • 20,970
  • 42
  • 97
  • 166
1
2 3
99 100