Installing Jest & Enzyme with React

Setting up to use Jest & Enzyme to test React Components.

Code |

February 28, 2020

With React 16,

yarn add -D enzyme enzyme-adapter-react-16

If you are using React project created with create-react-app, do not install Jest since it is already installed with create-react-app.

We then need to create src/setupTests.js in the src file with this code:

// setup file
import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

Once this is done, you can start using Enzyme to test React Components:

// test file
import { shallow, mount, render } from 'enzyme';

const wrapper = shallow(<Foo />);

If you are using React project that is not created with create-react-app, then you need to add the following code to Package.json:

{
  "jest": {
   "setupTestFrameworkScriptFile": "<rootDir>/path/to/setupTests.js",
  }
}

Copyright © 2020 Will Kim

Invely's