Setup Test in ReactJs With Jest Enzyme & etc

setupTest.md

• create setupTests.js in src/setupTests.js (automatically CRA read setupTest.js)

// setupTests.js
import React from "react";
import Adapter from "enzyme-adapter-react-16";
import Enzyme, { configure, shallow, mount, render } from "enzyme";
import { createSerializer } from "enzyme-to-json";
import sinon from "sinon";

expect.addSnapshotSerializer(createSerializer({ mode: "deep" }));

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

global.React = React;
global.Enzyme = Enzyme;
global.shallow = shallow;
global.render = render;
global.mount = mount;
global.sinon = sinon;

• update package.json

// package.json
"jest": {
    "snapshotSerializers": [
      "enzyme-to-json/serializer"
    ]
  }

• install dependencies

$ yarn add --dev  enzyme enzyme-adapter-react-16 enzyme-to-json sinon
$ yarn add --dev jest babel-jest 

• Example Error (if you test error)

[BABEL] {redacted}/src/setupTests.js: Unknown option: base.configFile. Check out http://babeljs.io/docs/usage/options/ for more information about options.
Resolution:

$ yarn list babel-core
├─ babel-core@6.26.3
└─ react-scripts@2.1.2
   └─ babel-core@7.0.0-bridge.0
# if list like this, fix with install babel-core
$ yarn add --dev babel-core@7.0.0-bridge.0
# run, again list of babel-core
$ yarn list babel-core
├─ babel-core@7.0.0-bridge.0
├─ babel-register@6.26.0
│  └─ babel-core@6.26.3
├─ jest-config@23.6.0
│  └─ babel-core@6.26.3
└─ jest-runtime@23.6.0
   └─ babel-core@6.26.3

# finally
$ yarn test

• don't forget eslint

"plugin:jest/recommended"