Jest 테스트 코드란 무엇인가?

송연지·2024년 12월 23일

프론트엔드(JS&TS&REACT&NODE&NEXT) 공부

목록 보기

20/33

Jest란?

Jest는 JavaScript와 TypeScript 프로젝트에서 테스트를 작성하고 실행하기 위한 강력한 테스트 프레임워크입니다. Jest는 단위 테스트(Unit Test), 통합 테스트(Integration Test), 스냅샷 테스트(Snapshot Test)를 지원하며, 간단한 설정으로 강력한 테스트 기능을 제공합니다.

Jest의 주요 특징

사용 용이성: 설정이 간단하며, Zero Configuration으로 바로 사용할 수 있습니다.
빠른 실행 속도: 테스트 파일을 병렬로 실행하여 성능을 최적화합니다.
스냅샷 테스트 지원: UI의 변경을 감지하고 시각적으로 비교합니다.
강력한 matcher: expect와 다양한 matcher(toBe, toEqual 등)를 사용하여 직관적인 테스트 작성 가능.
Mocking 지원: 함수, 모듈, 타이머 등을 Mocking하여 독립적인 테스트 가능.
타입스크립트와 호환: TypeScript를 지원하여 정적 타입 검사를 테스트 코드에 활용 가능.

테스트 코드 작성 예시

1.테스트할 함수: toUpperCase

toUpperCase 함수는 입력된 문자열을 대문자로 변환하는 간단한 유틸리티 함수입니다.

util.js 파일:

export function toUpperCase(str) {
  return str.toUpperCase();
}

2. Jest를 사용하여 toUpperCase 함수의 동작을 검증합니다.

util.test.js 파일:

import { toUpperCase } from "./util";

describe("toUpperCase 테스트입니다.", () => {
  // 테스트 케이스: 소문자를 대문자로 변환
  it("소문자를 넣으면 대문자를 리턴합니다.", () => {
    // AAA (Arrange, Act, Assert)

    // Arrange: 테스트에 필요한 초기 데이터 준비
    const input = "hello"; // 입력값
    const expectedOutput = "HELLO"; // 기대값

    // Act: 테스트 대상 함수 실행
    const actualOutput = toUpperCase(input);

    // Assert: 결과 검증
    expect(actualOutput).toBe(expectedOutput); // 실제 결과가 기대값과 일치하는지 확인
  });

  // 테스트 케이스: 이미 대문자인 경우
  it("대문자를 넣으면 그대로 반환합니다.", () => {
    const input = "WORLD";
    const expectedOutput = "WORLD";

    const actualOutput = toUpperCase(input);

    expect(actualOutput).toBe(expectedOutput);
  });

  // 테스트 케이스: 빈 문자열 처리
  it("빈 문자열을 넣으면 빈 문자열을 반환합니다.", () => {
    const input = "";
    const expectedOutput = "";

    const actualOutput = toUpperCase(input);

    expect(actualOutput).toBe(expectedOutput);
  });
});

3. 테스트 구조: Jest의 describe와 it 구문을 활용하여 구성했습니다.

describe:
테스트를 그룹화하여 논리적으로 묶습니다.
테스트 대상과 관련된 모든 테스트 케이스를 포함.

describe("toUpperCase 테스트입니다.", () => {
  ...
});

it 또는 test:
하나의 테스트 케이스를 정의.
첫 번째 인자로 테스트 설명, 두 번째 인자로 테스트 로직.

it("소문자를 넣으면 대문자를 리턴합니다.", () => {
  ...
});

- AAA 패턴:

Arrange: 테스트에 필요한 데이터를 준비.
Act: 테스트 대상 코드를 실행.
Assert: 실행 결과가 기대값과 일치하는지 검증.

// Arrange
const input = "hello";
const expectedOutput = "HELLO";

// Act
const actualOutput = toUpperCase(input);

// Assert
expect(actualOutput).toBe(expectedOutput);

4. 실행 방법

Jest 설치:

npm install jest --save-dev

테스트 실행:

npx jest

5. 테스트 결과

테스트를 실행하면 다음과 같은 결과가 출력됩니다.

 PASS  ./util.test.js
  toUpperCase 테스트입니다.
    ✓ 소문자를 넣으면 대문자를 리턴합니다. (5ms)
    ✓ 대문자를 넣으면 그대로 반환합니다. (2ms)
    ✓ 빈 문자열을 넣으면 빈 문자열을 반환합니다. (1ms)

Test Suites: 1 passed, 1 total
Tests:       3 passed, 3 total
Snapshots:   0 total
Time:        0.1s