본문으로 건너뛰기

시작하기

선호하는 패키지 관리자를 사용하여 제스트를 설치합니다.

bash
npm install --save-dev jest
bash
npm install --save-dev jest

두 개의 숫자를 더하는 가상의 함수가 있다고 가정하고, 이 함수에 대한 테스트를 작성해 보겠습니다.

먼저 sum.js 파일을 생성합니다.

js
function sum(a, b) {
  return a + b;
}
module.exports = sum;
js
function sum(a, b) {
  return a + b;
}
module.exports = sum;

그런 다음 sum.test.js 파일을 만듭니다. 여기에는 실제 테스트가 포함됩니다.

js
const sum = require('./sum');
test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});
js
const sum = require('./sum');
test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3);
});

package.json에 다음을 추가합니다.

json
{
  "scripts": {
    "test": "jest"
  }
}
json
{
  "scripts": {
    "test": "jest"
  }
}

마지막으로 yarn test나 npm test를 실행하면 제스트는 다음 메시지를 출력합니다.

bash
PASS  ./sum.test.js
✓ adds 1 + 2 to equal 3 (5ms)
bash
PASS  ./sum.test.js
✓ adds 1 + 2 to equal 3 (5ms)

제스트를 사용하여 첫 번째 테스트를 성공적으로 작성했습니다!

이 테스트는 expect와 toBe를 사용하여 두 값이 정확히 일치하는지 확인합니다. 제스트가 테스트할 수 있는 다른 항목에 대해 알아보려면 매처 사용하기를 참고하세요.

명령줄에서 실행하기​

yarn global add jest나 npm install jest --global로 제스트가 PATH에서 전역적으로 사용 가능하다면 CLI에서 제스트를 직접 실행할 수 있습니다. 이때 다양하고 유용한 옵션을 사용할 수 있습니다.

다음 명령은 config.json을 설정 파일로 사용해 my-test와 일치하는 파일에 제스트를 실행합니다. 실행 후에는 기본 OS 알림을 표시합니다.

bash
jest my-test --notify --config=config.json
bash
jest my-test --notify --config=config.json

명령줄로 jest를 실행하는 방법에 대해 더 알고 싶다면 제스트 CLI 옵션 페이지를 참고하세요.

추가 설정​

기본 설정 파일 생성하기​

제스트는 프로젝트를 기반으로 몇 가지 질문을 하고 각 옵션에 대한 간단한 설명이 포함된 기본 설정 파일을 생성합니다.

bash
jest --init
bash
jest --init

바벨 사용하기​

바벨을 사용하려면 다음과 같이 패키지를 설치합니다.

bash
npm install --save-dev babel-jest @babel/core @babel/preset-env
bash
npm install --save-dev babel-jest @babel/core @babel/preset-env

프로젝트의 루트에 babel.config.js 파일을 생성하여 노드의 현재 버전을 대상으로 하도록 바벨을 설정합니다.

babel.config.js
js
module.exports = {
  presets: [['@babel/preset-env', { targets: { node: 'current' } }]],
};
babel.config.js
js
module.exports = {
  presets: [['@babel/preset-env', { targets: { node: 'current' } }]],
};

웹팩 사용하기​

제스트는 웹팩으로 자산, 스타일, 컴파일을 관리하는 프로젝트에서 사용할 수 있습니다. 웹팩은 다른 도구에 비해 몇 가지 독특한 도전을 제공합니다.

시작하려면 웹팩 안내서를 참조하세요.

Vite 사용하기​

Vite를 사용해 기본 ESM으로 소스 코드를 제공하여 일부 프런트 엔드 툴링을 제공하는 프로젝트에서 제스트를 사용할 수 있습니다. Vite는 독특한 도구이며 즉시 사용 가능한 작업 흐름을 제공합니다. Vite 플러그인 시스템의 작동 방식 때문에 Vite가 완전히 지원되지는 않습니다. 하지만 최고의 제스트 통합 방법인 vite-jest를 사용하는 몇 가지 예시가 있습니다. vite-jest의 제한도 확인하세요.

시작하려면 Vite 안내서를 참조하세요. 또는 vitest를 사용할 수 있습니다.

파설 사용하기​

제스트는 웹팩과 유사하게 parcel-bundler로 자산, 스타일, 컴파일을 관리하는 프로젝트에서 사용할 수 있습니다. 파설에는 설정이 필요 없습니다.

시작하려면 공식 문서를 참조하세요.

타입스크립트 사용하기​

babel로 타입스크립트 사용하기​

제스트는 바벨로 타입스크립트를 지원합니다.

먼저 위의 바벨 사용하기 지침을 따랐는지 확인하고 @babel/preset-typescript을 설치합니다.

bash
npm install --save-dev @babel/preset-typescript
bash
npm install --save-dev @babel/preset-typescript

그리고 babel.config.js의 presets 목록에 @babel/preset-typescript를 추가합니다.

babel.config.js
js
module.exports = {
  presets: [
    ['@babel/preset-env', { targets: { node: 'current' } }],
    // highlight-next-line
    '@babel/preset-typescript',
  ],
};
babel.config.js
js
module.exports = {
  presets: [
    ['@babel/preset-env', { targets: { node: 'current' } }],
    // highlight-next-line
    '@babel/preset-typescript',
  ],
};

바벨과 타입스크립트를 사용할 때 몇 가지 주의 사항이 있습니다. 바벨의 타입스크립트 지원은 단순한 트랜스파일이므로 제스트는 테스트가 실행될 때 타입 검사를 하지 않습니다. 타입 검사를 원한다면 ts-jest를 사용하거나, 타입스크립트 컴파일러 tsc를 별도로 (또는 빌드 프로세스의 일부로) 실행할 수 있습니다.

ts-jest로 타입스크립트 사용하기​

ts-jest는 제스트에 대한 소스 맵을 지원하는 타입스크립트 전처리기입니다. 타입스크립트로 작성된 프로젝트를 제스트로 테스트하는 것이 가능해집니다.

bash
npm install --save-dev ts-jest
bash
npm install --save-dev ts-jest

타입 정의​

타입스크립트로 작성된 테스트 파일에서 제스트 전역 API를 사용하는 방법은 두 가지가 있습니다.

제스트와 함께 제공되며 제스트를 업데이트할 때마다 갱신되는 타입 정의를 사용할 수 있습니다. @jest/globals 패키지에서 API를 가져오기만 하면 됩니다.

sum.test.ts
ts
import { describe, expect, test } from '@jest/globals';
import { sum } from './sum';
describe('sum module', () => {
  test('adds 1 + 2 to equal 3', () => {
    expect(sum(1, 2)).toBe(3);
  });
});
sum.test.ts
ts
import { describe, expect, test } from '@jest/globals';
import { sum } from './sum';
describe('sum module', () => {
  test('adds 1 + 2 to equal 3', () => {
    expect(sum(1, 2)).toBe(3);
  });
});
팁

describe.each/test.each와 모조 함수의 추가 사용 설명서를 참조하세요.

또는 @types/jest 패키지를 설치하는 것을 선택할 수 있습니다. 별도로 가져올 필요 없이 제스트 전역에 대한 타입을 제공합니다.

bash
npm install --save-dev @types/jest
bash
npm install --save-dev @types/jest
정보

@types/jest는 DefinitelyTyped에서 관리되는 타사 라이브러리입니다. 따라서 최신 제스트 기능이나 버전은 아직 지원되지 않을 수 있습니다.

제스트와 @types/jest의 버전이 가능한 가까워야 합니다. 예를 들어 제스트 27.4.0을 사용한다면 @types/jest 27.4.x를 설치하는 것이 이상적입니다.