JavaScript 테스트 코드 작성 요령 – 개발자가 꼭 알아야 할 핵심 팁

도입 – 테스트 코드의 중요성과 활용도

현대 웹 개발에서 JavaScript 테스트 코드 작성 요령은 필수적인 개발 역량입니다. 테스트 코드는 단순히 버그를 찾는 도구가 아니라, 코드 품질을 보장하고 리팩토링을 안전하게 수행할 수 있게 하며, 팀 협업 시 신뢰성을 높여줍니다. 잘 작성된 테스트는 문서화 역할도 하여 새로운 팀원이 코드를 이해하는 데 큰 도움이 됩니다. 본 가이드에서는 실무에서 바로 활용할 수 있는 JavaScript 테스트 코드 작성의 핵심 팁들을 소개합니다.

핵심 팁 10가지

1. AAA 패턴으로 테스트 구조화하기

Arrange-Act-Assert 패턴은 테스트 코드의 가독성을 크게 향상시킵니다. Arrange 단계에서는 테스트에 필요한 데이터와 환경을 설정하고, Act 단계에서는 실제 테스트할 함수나 메서드를 실행하며, Assert 단계에서는 결과를 검증합니다. 이 구조를 일관되게 유지하면 다른 개발자들도 테스트 의도를 쉽게 파악할 수 있습니다.

test('사용자 이름을 올바르게 포맷팅해야 함', () => {
  // Arrange
  const rawName = '  john doe  ';
  
  // Act
  const formattedName = formatUserName(rawName);
  
  // Assert
  expect(formattedName).toBe('John Doe');
});

2. 명확하고 서술적인 테스트 이름 작성

테스트 이름은 “무엇을 테스트하는지”와 “예상 결과가 무엇인지”를 명확하게 표현해야 합니다. “test1”, “test2” 같은 이름 대신 “빈 배열이 주어졌을 때 기본값을 반환해야 함”처럼 구체적으로 작성하세요. 테스트가 실패했을 때 어떤 기능에 문제가 있는지 즉시 파악할 수 있습니다. 한글로 작성하면 더욱 직관적일 수 있지만, 팀 컨벤션에 따라 영어를 사용할 수도 있습니다.

// 나쁜 예
test('test1', () => { /* ... */ });

// 좋은 예
test('유효하지 않은 이메일 형식일 때 에러를 발생시켜야 함', () => {
  expect(() => validateEmail('invalid-email')).toThrow();
});

3. 하나의 테스트는 하나의 개념만 검증

단일 책임 원칙은 테스트 코드에도 적용됩니다. 하나의 테스트에서 여러 기능을 검증하면 테스트가 실패했을 때 정확한 원인을 파악하기 어렵습니다. 각 테스트는 하나의 동작이나 시나리오에 집중해야 합니다. 여러 assert가 필요하다면 관련성이 높은 경우에만 함께 사용하고, 그렇지 않다면 별도의 테스트로 분리하세요. 이렇게 하면 테스트 실패 시 디버깅 시간을 크게 줄일 수 있습니다.

// 나쁜 예 - 여러 개념을 한 테스트에서 검증
test('사용자 생성 테스트', () => {
  const user = createUser('John');
  expect(user.name).toBe('John');
  expect(user.email).toBeDefined();
  expect(user.role).toBe('user');
});

// 좋은 예 - 개념별로 분리
test('사용자 생성 시 이름이 설정되어야 함', () => {
  const user = createUser('John');
  expect(user.name).toBe('John');
});

test('사용자 생성 시 기본 역할이 user여야 함', () => {
  const user = createUser('John');
  expect(user.role).toBe('user');
});

4. Mock과 Stub을 적절히 활용

외부 의존성(API 호출, 데이터베이스, 파일 시스템 등)을 테스트할 때는 Mock과 Stub을 활용하여 격리된 환경에서 테스트하세요. 이를 통해 테스트 속도를 높이고 외부 요인으로 인한 테스트 실패를 방지할 수 있습니다. Jest의 jest.fn()이나 jest.mock()을 사용하면 쉽게 구현할 수 있습니다. 단, 과도한 mocking은 실제 통합 동작을 검증하지 못하므로 적절한 균형이 필요합니다.

test('API 호출 성공 시 데이터를 반환해야 함', async () => {
  // API 호출을 Mock으로 대체
  const mockFetch = jest.fn().mockResolvedValue({
    json: async () => ({ id: 1, name: 'John' })
  });
  global.fetch = mockFetch;
  
  const result = await fetchUser(1);
  
  expect(mockFetch).toHaveBeenCalledWith('/api/users/1');
  expect(result.name).toBe('John');
});

5. 테스트 데이터는 Factory 패턴으로 관리

테스트마다 반복적으로 사용되는 데이터는 Factory 함수나 Builder 패턴으로 생성하세요. 이렇게 하면 테스트 데이터 관리가 용이해지고, 데이터 구조가 변경되어도 한 곳만 수정하면 됩니다. 필요한 필드만 오버라이드할 수 있도록 설계하면 유연성이 높아집니다. 또한 테스트 코드의 중복을 줄이고 가독성을 개선할 수 있습니다.

// Test Factory
const createTestUser = (overrides = {}) => ({
  id: 1,
  name: 'Test User',
  email: '[email protected]',
  role: 'user',
  ...overrides
});

test('관리자 권한 확인', () => {
  const admin = createTestUser({ role: 'admin' });
  expect(hasAdminAccess(admin)).toBe(true);
});

6. 비동기 코드는 async/await로 명확하게 테스트

Promise나 비동기 함수를 테스트할 때는 async/await 문법을 사용하여 명확하게 작성하세요. 콜백 방식보다 가독성이 좋고 에러 처리도 직관적입니다. 테스트 함수에 async를 붙이고 await로 비동기 작업을 기다리면 됩니다. 또한 에러 케이스를 테스트할 때는 expect().rejects를 활용하면 편리합니다. 비동기 테스트는 타임아웃 설정도 고려해야 합니다.

test('비동기 데이터 로딩이 성공해야 함', async () => {
  const data = await loadData();
  expect(data).toBeDefined();
  expect(data.length).toBeGreaterThan(0);
});

test('잘못된 ID로 조회 시 에러가 발생해야 함', async () => {
  await expect(fetchUser(-1)).rejects.toThrow('Invalid user ID');
});

7. Edge Case와 경계값 테스트 포함

정상 케이스뿐만 아니라 엣지 케이스와 경계값도 반드시 테스트하세요. 빈 배열, null, undefined, 최대값, 최소값 등의 경우를 검증하면 예상치 못한 버그를 사전에 발견할 수 있습니다. 특히 사용자 입력을 다루는 함수는 다양한 예외 상황을 고려해야 합니다. 이러한 테스트는 프로덕션 환경에서의 안정성을 크게 향상시킵니다.

describe('배열 합계 계산', () => {
  test('정상적인 숫자 배열의 합계를 계산해야 함', () => {
    expect(sum([1, 2, 3])).toBe(6);
  });
  
  test('빈 배열은 0을 반환해야 함', () => {
    expect(sum([])).toBe(0);
  });
  
  test('음수가 포함된 배열도 처리해야 함', () => {
    expect(sum([-1, 1, 2])).toBe(2);
  });
  
  test('단일 요소 배열을 처리해야 함', () => {
    expect(sum([5])).toBe(5);
  });
});

8. 테스트 커버리지는 도구로 확인하되 맹신하지 않기

Jest의 –coverage 옵션을 사용하면 코드 커버리지를 확인할 수 있습니다. 하지만 높은 커버리지 수치가 품질을 보장하지는 않습니다. 중요한 것은 의미 있는 테스트를 작성하는 것입니다. 커버리지는 테스트되지 않은 코드를 찾는 도구로 활용하고, 핵심 비즈니스 로직과 복잡한 조건문은 반드시 테스트하세요. 일반적으로 80% 이상의 커버리지를 목표로 하되 품질을 우선시하세요.

// package.json
{
  "scripts": {
    "test": "jest",
    "test:coverage": "jest --coverage --coverageThreshold='{\"global\":{\"branches\":80,\"functions\":80,\"lines\":80}}'"
  }
}

9. beforeEach와 afterEach로 테스트 격리 보장

각 테스트는 독립적으로 실행되어야 하며 다른 테스트의 영향을 받지 않아야 합니다. beforeEach와 afterEach 훅을 사용하여 테스트 전후로 상태를 초기화하세요. 이렇게 하면 테스트 순서에 관계없이 일관된 결과를 얻을 수 있습니다. 데이터베이스 연결, 전역 상태, Mock 설정 등을 초기화하는 데 유용합니다. 테스트 격리는 신뢰할 수 있는 테스트 스위트의 핵심입니다.

describe('장바구니 기능', () => {
  let cart;
  
  beforeEach(() => {
    // 각 테스트 전에 새로운 장바구니 생성
    cart = new ShoppingCart();
  });
  
  afterEach(() => {
    // 테스트 후 정리
    cart.clear();
  });
  
  test('상품 추가가 정상 동작해야 함', () => {
    cart.addItem({ id: 1, name: 'Book' });
    expect(cart.getItemCount()).toBe(1);
  });
  
  test('빈 장바구니 상태를 확인해야 함', () => {
    expect(cart.isEmpty()).toBe(true);
  });
});

10. 테스트 실행 속도 최적화

테스트 스위트가 커질수록 실행 시간이 길어집니다. 병렬 실행, 불필요한 설정 제거, 통합 테스트와 단위 테스트 분리 등으로 속도를 개선하세요. Jest는 기본적으로 병렬 실행을 지원하며, –maxWorkers 옵션으로 조절할 수 있습니다. 느린 테스트는 별도로 분리하여 CI/CD 파이프라인에서 선택적으로 실행할 수 있습니다. 빠른 피드백 루프는 개발 생산성을 크게 향상시킵니다.

// jest.config.js
module.exports = {
  testTimeout: 10000,
  maxWorkers: '50%', // CPU 코어의 50% 사용
  testMatch: ['**/__tests__/**/*.test.js'],
  // 빠른 단위 테스트와 느린 통합 테스트 분리
  projects: [
    {
      displayName: 'unit',
      testMatch: ['**/__tests__/unit/**/*.test.js'],
    },
    {
      displayName: 'integration',
      testMatch: ['**/__tests__/integration/**/*.test.js'],
    },
  ],
};

실제 적용 사례

실무 프로젝트에서 JavaScript 테스트 코드 작성 요령을 적용한 사례를 살펴보겠습니다. 한 e-커머스 팀은 결제 모듈에 테스트를 도입하여 프로덕션 버그를 70% 감소시켰습니다. AAA 패턴으로 300개 이상의 테스트를 구조화했고, Factory 패턴으로 테스트 데이터를 관리하여 유지보수성을 크게 개선했습니다. API 호출은 Mock으로 대체하여 테스트 실행 시간을 5분에서 30초로 단축했습니다. 또한 Edge Case 테스트를 통해 음수 금액, 재고 부족 등의 예외 상황을 사전에 발견하고 처리할 수 있었습니다. CI/CD 파이프라인에 테스트를 통합하여 배포 전 자동 검증을 수행하고, 코드 커버리지를 85% 이상 유지하는 정책을 도입했습니다. 이를 통해 팀의 개발 속도는 유지하면서도 제품 품질을 획기적으로 향상시켰습니다.

주의사항 및 베스트 프랙티스

테스트 코드도 프로덕션 코드만큼 중요하므로 동일한 품질 기준을 적용하세요. 과도한 mocking은 실제 시스템 동작과 괴리를 만들 수 있으니 주의하고, 통합 테스트와 단위 테스트의 균형을 맞추세요. 테스트가 실패하면 즉시 수정하는 문화를 만들고, 테스트를 건너뛰거나 주석처리하지 마세요. TDD(Test-Driven Development)를 시도해보는 것도 좋은 학습 방법입니다. 정기적으로 테스트 코드를 리팩토링하고, 더 이상 필요 없는 테스트는 과감히 제거하세요.

마무리 및 추가 팁

JavaScript 테스트 코드 작성 요령을 마스터하면 자신감 있는 개발이 가능합니다. 작은 것부터 시작하여 점진적으로 테스트 커버리지를 높여가세요. Jest 공식 문서와 Testing Library를 활용하면 더 많은 팁을 얻을 수 있습니다. 테스트는 투자이며, 장기적으로 개발 시간과 비용을 절감시켜줍니다.