단위 테스트 Jest 사용 방법

Jest란?

Jest 는 코드가 제대로 동작하는 지 확인하는 test case 를 만드는 테스트 프레임워크입니다. 주로 React 애플리케이션을 테스트하기 위해 설계되었지만, 다른 JavaScript 프로젝트에서도 사용할 수 있습니다. Jest는 다양한 기능을 제공하여 테스트 작성, 실행 및 관리를 쉽게 만들어줍니다.

자동화된 테스트 실행

Jest는 테스트를 자동으로 탐지하고 실행할 수 있습니다. 특별한 설정이나 구성이 필요하지 않으며, 프로젝트에 기본적으로 포함된 도구입니다.

Snapshot 테스팅

React 컴포넌트의 출력물에 대한 스냅샷 테스트를 지원합니다. 이를 통해 변경된 부분을 쉽게 확인하고, 의도하지 않은 변경 사항을 방지할 수 있습니다.

Mock 함수

Jest는 함수를 모의(mock)하여 외부 종속성을 테스트하는 데 도움이 되는 기능을 제공합니다. 외부 API 호출이나 모듈 간의 통신을 시뮬레이션하고 테스트를 더 효과적으로 수행할 수 있습니다.

병렬 실행

Jest는 테스트를 병렬로 실행하여 성능을 향상시킵니다. 이는 큰 프로젝트에서 빠르게 테스트를 수행할 수 있게 도와줍니다.

내장된 테스트 러너 및 어설션 라이브러리

Jest는 자체적으로 테스트 러너와 어설션(assertion) 라이브러리를 가지고 있어, 따로 설치할 필요가 없습니다.

Jest 시작하는 방법

package.json 파일 만들기

프로젝트 루트 디렉토리에 package.json 파일이 없다면, 다음 명령어를 사용하여 생성합니다.


npm init -y

Jest 설치하기

Jest를 개발 의존성으로 설치합니다.

npm을 사용할 시


npm install --save-dev jest

yarn을 사용할 시


yarn add --dev jest

위 명령은 Jest를 개발 의존성으로 설치하고, package.json 파일의 devDependencies 섹션에 Jest가 추가됩니다.

test 스크립트 설정하기

package.json 파일을 열고 scripts 섹션에 다음과 같이 test 스크립트를 추가합니다.


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

프로젝트의 루트 디렉토리에서 npm test 또는 yarn test 명령어를 실행하면 Jest 테스트가 실행됩니다.

테스트 코드 작성하기 예시

먼저 test 파일을 생성합니다. (test 파일 명 ⇒ 테스트할 함수 파일명.test.js)


describe('계산 테스트', () => {
   const a = 1, b = 2;

   test('a + b는 3이다.', () => {
      expect(a + b).toEqual(3);
   });
});

/*
* describe('그룹 테스트 설명 문자열', () => {
*   const a = 1, b = 2; // 테스트에 사용할 일회용 가짜 변수 선언
*
*    test('개별 테스트 설명 문자열', () => {
*       expect(검증대상).toXxx(기대결과);
*    });
* });
*/

Jest 테스트 커맨드 지정 방법

Jest는 기본적으로 test.js로 끝나거나 __test__ 디렉터리 안에 있는 파일들을 모두 테스트 파일로 인식합니다. 만약 특정 테스트 파일만 실행하고 싶다면, npm test <파일명 이나 경로>를 입력하면 됩니다.


{
  "scripts": {
    "test": "jest",
    "test:1": "jest 1-example/",
    "test:2": "jest 2-review/",
    "test:3": "jest 3-review/",
    "test:watch": "jest --watch",
    "test:circleci": "jest --json --outputFile=.circleci/results.json",
    // 추가적으로 필요한 테스트 스크립트를 여기에 추가할 수 있습니다.
  }
}

전체 테스트 실행

Jest 전체 테스트를 실행합니다.


npm test


yarn test

개별 디렉토리 테스트 실행


npm run test:1

또는 다른 숫자에 해당하는 디렉토리를 지정하여 해당 디렉토리의 테스트만 실행할 수 있습니다.

실시간 감시 모드


npm run test:watch

Jest를 감시 모드로 실행하여 파일이 변경될 때마다 자동으로 테스트가 실행됩니다.

CircleCI 용 테스트 실행


npm run test:circleci

Jest를 CircleCI에서 사용할 수 있는 형식으로 실행하며, 결과는 .circleci/results.json 파일에 저장됩니다.

Jest 사용 방법

기본 테스트

`expect()` 와 `toBe()` 함수 사용 방법


// fn.js 
const fn = {
    add: (num1, num2) => num1 + num2,
};

module.exports = fn;

add 함수를 만들고 (num1, num2) 두 개의 인수를 받아서 더한 값을 return해주고 test 파일에서 사용할 수 있도록 module.exports 를 합니다.


// fn.test.js 
const fn = require('./fn');

// * 성공하는 케이스
test('숫자 1은 1입니다.', () => {
    expect(1).toBe(1); //expect(검증대상).toXxx(기대결과);
});

// * 성공하는 케이스
test('2 더하기 3 은 5 입니다.', () => {
    expect(fn.add(2, 3)).toBe(5);
});

// * 실패하는 케이스
test('3 더하기 3 은 5 입니다.', () => {
    expect(fn.add(3, 3)).toBe(5);
});

테스트 코드를 작성할 때, 이전에 만들어둔 fn 모듈을 불러오고 함수를 만들어줍니다. expect() 함수를 사용하여 검증 대상 값을 지정하고, toBe() 함수를 사용하여 기대하는 값을 설정합니다.

첫 번째, 두 번째는 성공하는 케이스로 세 번째는 실패하는 케이스로 지정해서 테스트를 진행합니다.

터미널을 확인하면 전체 3개의 테스트 중 2개는 성공했고 1개는 실패했다는 안내가 제공됩니다. 위쪽을 확인해보면 어떤 테스트가 실패했는지 아까 작성해두었던 설명을 통해 쉽게 확인을 할 수 있습니다. 그렇게 때문에 설명을 작성할 때는 쉽고 명확하게 작성을 해야 합니다.

fail에서 pass로 `not` 사용

테스트를 성공으로 만들기 위해 코드를 수정하지 않고, 3 더하기 3 은 6 입니다.로 수정하지 않고 not.toBe()를 사용하여 pass시킬 수 있습니다.


// fn.test.js 
const fn = require('./fn');

// * 성공하는 케이스
test('숫자 1은 1입니다.', () => {
    expect(1).toBe(1); //expect(검증대상).toXxx(기대결과);
});

// * 성공하는 케이스
test('2 더하기 3 은 5 입니다.', () => {
    expect(fn.add(2, 3)).toBe(5);
});

// * 실패하는 케이스에서 성공하는 케이스로
test('3 더하기 3 은 5가 아닙니다.', () => {
    expect(fn.add(3, 3)).not.toBe(5);
});

터미널을 다시 확인하면 모든 3가지 케이스가 pass되었음을 확인할 수 있습니다.

위 코드에서 toBe() 함수는 여러가지 Matcher 중 하나로, 주로 숫자나 문자와 같은 기본 타입 값을 비교할 때 사용됩니다.

유용한 Matchers

`toEqual()`함수

toBe()함수와 비슷한 toEqual()함수에 대해 알아보겠습니다. 첫 번째 테스트엔 두 방법 모두 pass했습니다. 두 번째


// fn.test.js 
const fn = require('./fn');

// ! toBe()와 비슷한 toEqual() 비교

// *toBe()
test('2 더하기 3 은 5 입니다.', () => {
    expect(fn.add(2, 3)).toBe(5);
});

// *toEqual()
test('2 더하기 3 은 5 입니다.', () => {
    expect(fn.add(2, 3)).toEqual(5);
});