TypeScript 테스트 전략 완벽 가이드

TypeScript 프로젝트에서 효과적인 테스트를 작성하는 방법을 학습합니다. Jest를 활용한 단위 테스트부터 통합 테스트까지 실전 예제로 배워봅니다.

---

---

들어가며

이 글에서는 TypeScript 테스트 전략 완벽 가이드에 대해 상세히 알아보겠습니다. 총 8가지 주요 개념을 다루며, 각각의 개념에 대한 설명과 실제 코드 예제를 함께 제공합니다.

목차

1. 기본_단위_테스트_작성
2. 타입_안전한_Mock_데이터
3. 비동기_함수_테스트
4. Mock_함수_사용하기
5. 예외_처리_테스트
6. 배열과_객체_테스트
7. 테스트_전후_설정
8. 타입_가드_테스트

---

1. 기본 단위 테스트 작성

개요

Jest를 사용하여 간단한 함수의 단위 테스트를 작성합니다. 테스트 케이스는 함수의 입력과 출력을 검증합니다.

코드 예제

function add(a: number, b: number): number {
  return a + b;
}

test('두 숫자를 더한다', () => {
  expect(add(2, 3)).toBe(5);
  expect(add(-1, 1)).toBe(0);
});

설명

describe와 test 함수로 테스트를 구조화하고, expect와 toBe 매처로 결과를 검증합니다.

---

2. 타입 안전한 Mock 데이터

개요

TypeScript의 타입 시스템을 활용하여 안전한 Mock 데이터를 생성합니다. 인터페이스를 기반으로 테스트 데이터를 만듭니다.

코드 예제

interface User {
  id: number;
  name: string;
  email: string;
}

const mockUser: User = {
  id: 1,
  name: '홍길동',
  email: 'hong@test.com'
};

test('사용자 정보 검증', () => {
  expect(mockUser.id).toBe(1);
});

설명

인터페이스로 타입을 정의하면 Mock 데이터 생성 시 타입 안전성을 보장받을 수 있습니다.

---

3. 비동기 함수 테스트

개요

async/await 패턴을 사용하는 비동기 함수를 테스트합니다. Promise를 반환하는 함수의 결과를 검증합니다.

코드 예제

async function fetchUser(id: number): Promise<User> {
  return { id, name: 'Test', email: 'test@test.com' };
}

test('사용자 데이터 가져오기', async () => {
  const user = await fetchUser(1);
  expect(user.id).toBe(1);
  expect(user.name).toBe('Test');
});

설명

test 함수를 async로 만들고 await를 사용하여 비동기 함수의 결과를 검증합니다.

---

4. Mock 함수 사용하기

개요

jest.fn()을 사용하여 함수의 호출 여부와 인자를 추적합니다. 외부 의존성을 격리하여 테스트합니다.

코드 예제

const mockCallback = jest.fn((x: number) => x * 2);

test('콜백 함수 호출 검증', () => {
  [1, 2].forEach(mockCallback);

  expect(mockCallback).toHaveBeenCalledTimes(2);
  expect(mockCallback).toHaveBeenCalledWith(1);
  expect(mockCallback).toHaveBeenCalledWith(2);
});

설명

Mock 함수는 호출 횟수, 전달된 인자, 반환값 등을 추적하여 함수 동작을 검증합니다.

---

5. 예외 처리 테스트

개요

함수가 올바르게 에러를 던지는지 검증합니다. toThrow 매처를 사용하여 예외 상황을 테스트합니다.

코드 예제

function divide(a: number, b: number): number {
  if (b === 0) throw new Error('0으로 나눌 수 없습니다');
  return a / b;
}

test('0으로 나누면 에러 발생', () => {
  expect(() => divide(10, 0)).toThrow('0으로 나눌 수 없습니다');
  expect(() => divide(10, 2)).not.toThrow();
});

설명

화살표 함수로 감싸서 예외를 던지는 함수를 테스트하고, 에러 메시지도 검증합니다.

---

6. 배열과 객체 테스트

개요

배열과 객체의 내용을 검증하는 다양한 매처를 사용합니다. toEqual, toContain 등으로 복잡한 데이터를 테스트합니다.

코드 예제

test('배열과 객체 검증', () => {
  const arr = [1, 2, 3, 4];
  expect(arr).toContain(3);
  expect(arr).toHaveLength(4);

  const obj = { name: '테스트', age: 20 };
  expect(obj).toEqual({ name: '테스트', age: 20 });
});

설명

toBe는 참조 비교, toEqual은 값 비교를 수행합니다. 배열과 객체 테스트에는 toEqual을 사용합니다.

---

7. 테스트 전후 설정

개요

beforeEach와 afterEach를 사용하여 각 테스트 전후에 실행할 코드를 정의합니다. 테스트 환경을 초기화합니다.

코드 예제

let database: string[] = [];

beforeEach(() => {
  database = ['초기데이터'];
});

test('데이터 추가', () => {
  database.push('새데이터');
  expect(database).toHaveLength(2);
});

설명

beforeEach는 각 테스트 실행 전에 호출되어 테스트 간 상태가 격리되도록 합니다.

---

8. 타입 가드 테스트

개요

TypeScript의 타입 가드 함수가 올바르게 타입을 좁히는지 테스트합니다. 런타임 타입 체크를 검증합니다.

코드 예제

function isString(value: unknown): value is string {
  return typeof value === 'string';
}

test('타입 가드 함수 검증', () => {
  expect(isString('hello')).toBe(true);
  expect(isString(123)).toBe(false);
  expect(isString(null)).toBe(false);
});

설명

타입 가드는 런타임에 타입을 체크하는 함수로, 다양한 입력값에 대해 테스트합니다. --- TypeScript 테스트 전략에 대한 8개의 카드를 생성했습니다. 각 카드는 실제 작동하는 코드 예제와 함께 초급 개발자도 이해하기 쉽게 설명되어 있습니다. Jest를 기반으로 한 실전 테스트 패턴을 다룹니다.

---

마치며

이번 글에서는 TypeScript 테스트 전략 완벽 가이드에 대해 알아보았습니다. 총 8가지 개념을 다루었으며, 각각의 사용법과 예제를 살펴보았습니다.

관련 태그

#TypeScript #Jest #UnitTest #Testing #MockData