• https://jestjs.io/
• https://testing-library.com/docs/react-testing-library/intro/

코드를 리팩토링하는 동안 반복적인 테스트를 수동으로 실행해 왔습니다.

이제 Next.js 환경에서 유닛 테스트를 작성하기 위해 테스팅 라이브러리를 도입하려고 합니다.

패키지 설치

개발 환경에서만 사용하기 때문에 devDependencies에 패키지를 설치합니다.

npm install -D jest @types/jest jest-environment-jsdom @testing-library/jest-dom @testing-library/react @testing-library/dom

설정 파일 작성

프로젝트 루트에 jest.config.js와 jest.setup.js 파일을 생성한 후, 다음과 같이 설정합니다.

touch jest.config.js
touch jest.setup.js

jest.setup.js

import "@testing-library/jest-dom";

jest.config.js

import type { Config } from 'jest';
import nextJest from 'next/jest.js';

const createJestConfig = nextJest({
  dir: './',
});

const config: Config = {
  coverageProvider: 'v8',
  moduleNameMapper: {
    '^@/(.*)$': '<rootDir>/src/$1',
  },
  preset: 'ts-jest',
  rootDir: './',
  setupFilesAfterEnv: ['<rootDir>/jest.setup.js'],
  testEnvironment: 'jsdom',
  testEnvironmentOptions: {
    customExportConditions: [''],
  },
};

export default createJestConfig(config);