[Jest] Jest란?

이번 글에서는 JavaScript 진영에서 사용하는 테스팅 프레임워크인 Jest가 무엇인지 알아보려고한다. 테스팅 프레임워크는 작성한 코드가 예측한대로 동작하는지 테스트해보기 위한 Tool 정도로 생각하면 된다. 코드를 테스트하고 테스트한 코드를 저장해두고 안정성 검증 용도로 사용하면 로직이 변경 됐을 때 기존코드와 다른점을 쉽게 파악할 수 있다.

출처: https://www.redbubble.com/i/sticker/Jest-Logo-by-hipstuff/27351876.EJUG5

 

불필요한 설명일 수 있지만 아주 간단히 테스트 코드가 왜 필요한지 설명을 하자면, 아래와 같이 코드의 변경이 있다고 했을때 같은 테스트 코드로 확인 했을 때  정상동작하던 것이 수정후에는 실패하는 걸 확인할 수 있을 것이다. 그러면 당연히 잘못된 것을 인지하고 로직을 수정하거나 테스트 예상결과를 수정하여 테스트 코드를 성공시킬 것이다. 이런식으로 테스트를 하면서 안정성을 유지하기 위해 필요한 것이 바로 테스트 코드이다.

// AS-IS (input: 1, 2, output: 3) - SUCCESS
const f = (num1, num2) => {
  return num1 + num2;
}

// TO-BE (input: 1, 2, output: 2) - FAIL
const f = (num1, num2) => {
  return num1 * num2;
}

test("cal function", () => {
    expect(f(1, 2)).toBe(3); // expect 3으로 Fix
});

 

 

왜 Jest를 사용하나?

Jest를 사용하는 이유는 공식홈페이지의 내용을 인용했다.

1. FAST AND SAFE:  Jest는 테스트를 병렬로 안정적으로 실행할 수 있습니다. 작업을 빠르게 하기 위해 이전에 실패한 테스트를 먼저 실행하고 테스트 파일이 걸리는 시간에 따라 실행을 재구성합니다.
2. CODE COVERAGE: 플래그를 추가하여 코드 커버리지를 생성합니다 --coverage. 추가 설정이 필요하지 않습니다. Jest는 테스트되지 않은 파일을 포함하여 전체 프로젝트에서 코드 커버리지 정보를 수집할 수 있습니다.
3. EASY MOCKING: Jest는 테스트에서 import를 위해 사용자 지정 resolver를 사용하므로 테스트 범위 밖의 개체를 간단하게 mocking 할 수 있습니다. 풍부한 Mock Functions API를 이용하여 쉽게 mocking하여 읽을 수 있는 테스트 구문으로 함수 호출을 감시할 수 있습니다. (spyOn, fn)
4. GREAT EXCEPTIONS: Jest는 테스트가 실패할 경우 풍부한 컨텍스트를 제공합니다. (ToBeCloseTo, ToEqual 등등) 

실제 Jest는 사용하기 쉽고 mocking 용이 했는데, 이런 부분을 실제 실습을 하면서 경험하면 좋을것 같다.

 

간단한 실습

아주 간단한 테스트 코드를 작성하여 Jest가 동작하는 모습을 보도록 하자.

1. Jest 설치

npm i jest

 

2. pakcage.json 에 test tool을 jest를 사용한다고 명시하기

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

 

3. 간단한 테스트 코드 작성 (파일명: jest1.test.js)

const f = (num1, num2) => {
    return num1 + num2;
  }

test("add function", () => {
    expect(f(1, 2)).toBe(3);
});

 

4. 테스트 코드 실행 및 결과 확인

npm test jest1.test.js

> test
> jest jest1.test.js

 PASS  ./jest1.test.js
  √ add function (2 ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        0.735 s, estimated 1 s
Ran all test suites matching /jest1.test.js/i.

 

Jest 에 대한 간단한 설명 및 실습을 진행했다. 다음 글에서는 Jest에서 제공하는 기능은 어떤 것이 있는지 살펴보도록 하자.

 

참고 

Jest