Jest Test Framework

Jest는 Facebook에서 개발된 테스트 프레임워크로, JavaScript 프로젝트를 위한 강력하고 범용적인 도구입니다. 이 포스팅에서는 Jest의 개요, 기능, 그리고 사용법에 대해 자세히 알아보겠습니다.

Jest는 단위 테스트, 통합 테스트, 스냅샷 테스트 등 다양한 유형의 테스트를 지원하는 범용적인 테스트 프레임워크입니다. JavaScript, TypeScript, React, Vue, Angular 등 다양한 프로젝트에서 사용할 수 있습니다. 또한, 자체적으로 mocking과 코드 커버리지 리포트 등의 기능을 제공하여 테스트 작성과 실행을 용이하게 합니다.

- Jest is a delightful JavaScript Testing Framework with a focus on simplicity.
It works with projects using: Babel, TypeScript, Node, React, Angular, Vue and more! - https://jestjs.io/

주요 기능

자동 mocking

자동으로 mocking을 생성하고 관리하여 의존성을 가진 모듈들을 테스트할 수 있습니다.

코드 커버리지 리포트

코드 커버리지 리포트(Code Coverage Report)는 테스트 수행 시 프로젝트의 소스 코드에서 얼마나 많은 부분이 테스트되었는지를 보여주는 보고서입니다. 코드 커버리지는 테스트 스위트가 소스 코드의 어느 부분을 실행하고 테스트하는지를 측정하여 확인할 수 있게 해줍니다.

코드 커버리지 리포트를 통해 테스트의 범위와 품질을 파악하여 소프트웨어의 신뢰성을 향상시킬 수 있습니다. 이를 통해 테스트 커버리지를 관리하고 코드의 품질을 개선할 수 있습니다.

강력한 어설션(assertion)

어설션(assertion) 메서드는 테스트 코드에서 예상 결과와 실제 결과를 비교하고, 두 값이 일치하는지를 확인하는 역할을 합니다. Jest에서는 다양한 어설션 메서드를 제공하여 테스트 코드를 작성할 때 사용할 수 있습니다.

가장 기본적인 어설션 메서드는 expect 함수를 통해 호출하며, 이를 통해 테스트 코드에서 예상 결과를 설정할 수 있습니다.

병렬 실행

테스트를 병렬로 실행하여 효율적으로 테스트를 수행할 수 있습니다.

스냅샷 테스트

스냅샷 테스트(Snapshot Testing)는 테스트 코드를 작성할 때 컴포넌트의 렌더링 결과나 데이터 구조 등을 스냅샷으로 저장하고, 이후에 변경 여부를 검사하여 테스트하는 방법입니다. Jest는 스냅샷 테스트를 지원하는 기능을 제공하고 있습니다.

스냅샷 테스트는 컴포넌트의 UI 렌더링 결과나 데이터 구조 등이 예상한 대로 유지되는지를 확인하는 데 유용합니다. 특히 UI 컴포넌트의 렌더링 결과가 복잡하거나 변경이 잦은 경우에 유용하게 사용될 수 있습니다.

설치 방법

1. 프로젝트 디렉토리로 이동합니다.

cd my-project

2. Jest를 설치합니다.

npm install --save-dev jest

3. package.json 파일을 열어 "scripts" 항목에 테스트 실행 스크립트를 추가합니다.

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

4. 테스트를 위한 파일을 생성합니다. 일반적으로 테스트 파일은 .test.js나 .spec.js와 같은 이름 패턴을 따릅니다.

5. 작성한 테스트 파일에서 테스트를 작성합니다. 이전에 작성한 sum.test.js 파일을 참고하여 테스트 코드를 작성하면 됩니다.

// sum.js
function sum(a, b) {
  return a + b;
}

module.exports = sum;

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

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

test('adds 3 + 5 to equal 8', () => {
  expect(sum(3, 5)).toBe(8);
});

위의 코드는 sum.js 파일에서 sum 함수를 정의하고, sum.test.js 파일에서 해당 함수의 테스트 코드를 작성한 예시입니다.

• test 함수를 사용하여 테스트 케이스를 정의합니다.

• expect 함수를 사용하여 예상 결과를 설정하고, toBe 메서드를 사용하여 실제 결과와 비교합니다.

• 테스트 케이스가 예상한 대로 동작하면 테스트는 통과하고, 그렇지 않으면 테스트는 실패합니다.

Jest는 테스트 파일을 실행하고 결과를 출력해주는 기능을 제공합니다. 터미널에서 jest 명령어를 실행하면 Jest가 테스트 파일을 찾고 실행한 뒤, 결과를 보여줍니다.

위 예시 코드를 실행하면 첫 번째 테스트 케이스는 통과하고, 두 번째 테스트 케이스는 실패할 것입니다. 이러한 테스트 코드를 작성하여 함수의 동작을 검증하고, 코드 변경 시 테스트를 통해 예기치 않은 동작의 변화를 발견할 수 있습니다.

toBe 외에도, toEqual, toBeTruthy, toBeFalsy 등 테스트를 위한 다양한 매서드가 존재합니다.

• toBe
  예상 결과와 실제 결과가 엄격하게 일치하는지를 검사합니다. 즉, 값과 타입까지 동일해야 합니다.

• toEqual
  예상 결과와 실제 결과가 느슨하게 일치하는지를 검사합니다. 값은 동일하지만 타입까지 일치할 필요는 없습니다.

• toBeTruthy
  예상 결과가 참(truthy)인지를 검사합니다.

• toBeFalsy
  예상 결과가 거짓(falsy)인지를 검사합니다.

• toContain
  배열이나 문자열에 특정 값이 포함되어 있는지를 검사합니다.

• toHaveBeenCalled
  함수가 호출되었는지를 검사합니다.

• toHaveBeenCalledWith
  함수가 특정 매개변수와 함께 호출되었는지를 검사합니다.

더 자세한 매서드의 사용법과 예시는 Jest 공식 문서에서 확인할 수 있습니다.

6. 터미널에서 아래의 명령어를 실행하여 Jest를 실행합니다.

npm test

위의 과정을 따라하면 Jest를 설치하고 테스트를 실행할 수 있습니다.

마무리

이상으로 Jest의 설치와 간단한 사용법을 알아보았습니다. Jest를 사용하여 테스트를 작성하고 실행하는 과정에서 추가적인 설정이 필요하다면 Jest 공식 문서를 참고하시면 도움이 될 것 같습니다.

---

https://jestjs.io/