[Jest] Jest 기초, Jest Getting Started

Kozel·2022년 10월 30일

JavaScript jest

1. 개요

JavaScript로 개발 시 코드를 미리 테스트해 볼 필요가 있다.

이때 사용하는게 바로 'Jest'이다.

Jest란? 코드가 구현한대로, 즉 원하는 결과가 제대로 나오는지 확인할 수 있도록 test case를 만들어 주는 'JavaScript Testing FrameWork'이다.

Jest를 사용함을 통해서 보다 안정적이게 코드의 동작을 확인하고 보수 할 수 있다.

본문에서 Jest 설치와 기본 사용법을 살펴보자.

2. 본문

2.1. Jest 라이브러리 설치

우선 Jest 라이브러리를 설치해 보자.

다음은 설치 명령어이다.

// npm
npm install --save-dev jest

// Yarn
yarn add --dev jest

다음 명령어로 설치하면 package.json에 다음과 같이 추가된다.

// package.json
"devDependencies": {
  "jest": "^29.2.2"
}

이때 dependencies가 아닌 devDependencies에 설치되는 것을 볼 수 있는데, devDependencies는 개발 시 사용하는 패키지를 설치하는 곳으로 배포시에는 포함되지 않는다.

즉 Jest 라이브러리는 개발 의존성으로 설치된다.

추가로 CRA(리액트)환경에서는 이미 App.test.js로 Jest를 사용하고 있으므로 따로 설치할 필요가 없다.

2.2. test Script 수정

package.json 파일에서 test Script를 jest로 수정해준다.

// package.json
"scripts": {
  "test": "jest"
}

위 코드는 명령어를 설정해주는 것인데, 위와 같이 수정했다면 다음의 명령어로 test를 진행할 수 있다.

// npm
npm test

// yarn
yarn test

2.3. 단일 파일 test

npm test를 통해 실행하면 모든 테스트 파일을 테스트한다.

그럼 단일 파일만 테스트하고싶다면? jest-cli를 추가로 설치해야 한다.

npm i -g jest-cli

위의 명령어를 통해 설치했다면 다음의 명령어로 단일 파일에 대한 Jest Test를 진행할 수 있다.

jest '파일명'.test.js

2.4. test 파일 생성

파일 이름 규칙
Jest는 다음과 같은 명명 규칙을 가진 테스트 파일을 찾아 Jest Test를 진행한다.

__tests __ 폴더에 .js 접미사가 있는 파일
.test.js 접미사가 있는 파일
.spec.js 접미사가 있는 파일

그러므로 명명 규칙을 잘 지켜 테스트 파일을 생성해 보자.

cra 공식 페이지에선 테스트 파일을 테스트 중인 코드 옆에 배치하는 것을 추천한다.
이는 같은 디렉터리 내에 파일을 배치하여 가져올 때 코드를 짧게 쓸 수 있기 때문이다.

필자는 Sum.test.js 파일을 생성했다.

2.5. test 파일 작성

Jest 라이브러리를 통해 가장 기초적인 방법으로 작성해보려 한다.

// Sum.test.js
let foo;

describe("sum test", () => {
  beforeEach(() => {
    foo = 10;
  });
  
  afterEach(() => {
    foo = 0;
  });
  
  test('foo plus 10', () => {
    expect(foo + 10).toBe(20);
  });
});

describe("minus test", () => {
  beforeEach(() => {
    foo = 100;
  });
  
  afterEach(() => {
    foo = 0;
  });
  
  test('foo minus 50', () => {
    expect(foo - 50).toBe(50);
  });
});

describe() : Test 단위를 묶는 가장 큰 단위이다. describe에 기재된 내용(ex. "sum test")으로 단위를 분류한다.
test(), it() : test()를 통해 테스트를 진행한다. 이때 it()도 사용할 수 있는데 둘의 기능적인 차이는 없고, it()은 test()의 alias라고 한다.

'테스트 코드 이름' 과 '테스트 코드', 이 두 인자를 받는다.
expect() : 테스트 할 코드를 넣어 준다.
toBe(), toEqual() : toBe()는 단순 비교, toEqual()은 배열이나 객체 내부 깊은 비교를 수행한다.

공식 문서에 의하면 toEqual()은 객체 또는 배열의 모든 필드를 재귀적으로 검사한다고 한다.
beforeEach() : test를 진행하기 전 최초 1회 실행되는 전처리기이다.
afterEach() : test가 모두 진행된 후 마지막에 1회 실행되는 후처리기이다.