Jest 로 시작하는 유닛 테스트 — 설치부터 Globals·Expect 까지

이 글은 2020년 6월 작성한 Jest 학습 시리즈 3편을 통합한 아카이브본입니다. Vitest 가 Vite 진영에서 등장했지만 Jest 는 여전히 React 생태계에서 표준 도구로 남아있습니다.

Jest 란?

Jest 는 Facebook 에서 만든 Javascript 테스트 프레임워크로, 설정 없이도 즉시 사용 가능한 "Zero Config" 를 표방합니다. 테스트 러너, 어설션 라이브러리, 모킹, 커버리지 리포트까지 단일 패키지로 제공하는 것이 특징입니다.

React 팀이 공식적으로 Create React App 에 포함시키면서 프론트엔드 유닛 테스트의 사실상 표준이 되었습니다.

1단계: 설치와 첫 테스트

npm install --save-dev jest

package.json 의 scripts 에 "test": "jest" 를 추가합니다. sum.js 를 만들고:

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

sum.test.js 로 테스트 작성:

const sum = require('./sum');

test('1 + 2 = 3', () => {
  expect(sum(1, 2)).toBe(3);
});

npm test 실행하면 Jest 가 .test.js 파일을 자동 탐색해 실행합니다.

2단계: Globals — 테스트 구조화

Jest 는 테스트 파일마다 import 없이 쓸 수 있는 전역 함수들을 제공합니다.

수명주기 훅

함수	시점
beforeAll(fn)	파일의 모든 테스트 실행 전 1회
afterAll(fn)	파일의 모든 테스트 실행 후 1회
beforeEach(fn)	각 테스트 직전
afterEach(fn)	각 테스트 직후

DB 연결·더미 데이터 세팅 등 공통 준비에 사용.

테스트 그룹핑

describe('계산기', () => {
  test('더하기', () => {
    /* ... */
  });
  test('빼기', () => {
    /* ... */
  });
});

describe.each 로 데이터 기반 반복 테스트:

describe.each([
  [1, 2, 3],
  [2, 3, 5],
])('sum(%i, %i)', (a, b, expected) => {
  test(`= ${expected}`, () => {
    expect(sum(a, b)).toBe(expected);
  });
});

격리와 집중

• test.only — 해당 테스트만 실행
• test.skip — 해당 테스트 건너뜀
• test.todo('...') — 구현 전 표시만

3단계: Expect Matcher

expect(actual).matcher(expected) 구조로 어설션을 작성합니다.

값 비교

Matcher	용도
.toBe(x)	Object.is 기반 원시값 비교
.toEqual(x)	깊은 구조 비교 (객체·배열)
.toStrictEqual(x)	toEqual + undefined 속성·타입까지 엄격
.toBeNull() / .toBeUndefined() / .toBeDefined()	특정 값
.toBeTruthy() / .toBeFalsy()	불리언 변환 기준
.toBeGreaterThan(n) / .toBeLessThan(n)	숫자 비교
.toBeCloseTo(n, digits)	부동소수점 오차 허용

배열·객체 포함 여부

Matcher	용도
.toContain(x)	배열이 원소 포함
.toHaveLength(n)	배열·문자열 길이
.toHaveProperty('a.b.c', v?)	중첩 속성 존재·값
expect.arrayContaining([...])	부분 배열 매칭
expect.objectContaining({...})	부분 객체 매칭

함수 호출 검증 (Mock)

Matcher	용도
.toHaveBeenCalled()	한 번이라도 호출됨
.toHaveBeenCalledTimes(n)	정확한 호출 횟수
.toHaveBeenCalledWith(...args)	특정 인자 조합으로 호출됨
.toHaveBeenLastCalledWith(...args)	마지막 호출 인자

에러 검증

expect(() => {
  throwingFn();
}).toThrow('Expected message');

학습 회고

처음 Jest 를 도입했을 때 가장 좋았던 점은 설정 없이 바로 테스트를 쓸 수 있다 는 것이었습니다. Mocha + Chai + Sinon 조합에 비해 단일 패키지로 모든 걸 해결할 수 있어 도입 장벽이 낮았습니다.

반면 내장 jsdom 의 한계나 ESM 호환성 문제는 계속 개선 중인 영역입니다. 이후에 Vitest 가 등장했지만, React 생태계에서는 여전히 Jest 가 표준으로 자리잡고 있습니다.