Enzyme을 이용하여 리액트 테스트하기

설치

yarn add enzyme enzyme-adapter-react-16

17은 아직 React 17과 호환되지 않는다고 한다.

그래서 enzyme-adapter-react-16을 설치하였고, 리액트 버전을 16으로 다운그레이드 시켜줘야 했다.

.babelrc

{
    "presets": [
      "@babel/preset-react"
    ],
    "plugins": [
        "@babel/plugin-syntax-jsx"
    ]
  }

리액트 에러가 안난다면 건너뛰기

테스트 시 React를 읽지 못했기 때문에 .babelrc 파일을 추가했었는데, 리액트 버전 문제였다.

만약 파일 추가시에도 에러가 난다면 위 preset과 plugin을 인스톨한다.

setupTests.js

src 경로에 setupTests.js 파일 생성

import { configure } from "enzyme";
import Adapter from "enzyme-adapter-react-16";

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

package.json

package.json 바깥에 jest 속성 추가

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