본문으로 바로가기

Jest를 사용하는 이유

category 1. 웹개발/1_1_7 Jest 2023. 12. 17. 18:26

 

 

현대 웹 개발에서 코드의 안정성과 신뢰성은 점점 더 중요해지고 있습니다. 이런 상황에서 코드의 품질을 보장하고 버그를 최소화하기 위해선 강력한 테스트 프레임워크가 필수적입니다. 그중에서도 Jest는 자바스크립트 개발자들에게 널리 사용되는 강력한 도구 중 하나입니다. 이번 글에서는 Jest에 대해 알아보도록 하겠습니다.

 

 

테스트의 종류

1. Unit Test (단위 테스트)

개별 컴포넌트, 함수, 또는 모듈 등 코드의 작은 부분들을 테스트 하는 것

 

2. Integration Test (통합 테스트)

여러 컴포넌트 간의 상호 작용을 테스트하는 것

 

3. E2E Test (End-To-End 테스트)

유저 입장에서 유저의 모든 상황에 대해 시작부터 끝까지 테스트하는 것

 

 

Jest란?

Jest는 페이스북에서 개발한, 자바스크립트 코드의 정확성을 테스트할 수 있도록 테스트 코드 작성을 도와주는 자바스크립트 테스트 프레임워크입니다.

 

1. 편리한 구성

Jest는 기본적인 구성이 간단하며, 추가적인 설정이 거의 필요하지 않습니다. 대부분의 프로젝트에서 손쉽게 사용할 수 있도록 사전 구성이 잘 되어 있습니다.

 

2. 자동 Mocking

자동으로 모듈을 mocking하고 가짜(Mock) 객체를 생성하는 기능을 제공하여 테스트 환경을 구성하는 과정을 간단하게 만듭니다. 아래는 Mock의 주요 기능입니다.

 

의존성 분리

- 테스트 시 실제 서비스나 외부 리소스와의 의존성을 제거하고 Mock 객체를 통해 테스트할 코드를 독립적으로 실행할 수 있습니다.

동작 제어

- 모듈의 특정 함수의 동작을 원하는대로 제어할 수 있습니다. 예를 들어, 네트워크 호출을 mocking 하여 가짜 응답을 반환하도록 할 수 있습니다.

테스트 격리

- 각각의 테스트 케이스는 독립적으로 실행되므로, 다른 테스트 케이스에 의해 영향받지 않고 모듈의 동작을 검증할 수 있습니다.

성능 개선

- 특히 네트워크 호출이나 비싼 작업을 수행하는 모듈의 경우, Mock 모듈을 사용하여 성능을 향상시킬 수 있습니다.

// axios 모듈을 mocking
jest.mock('axios');

test('fetches data from an API', async () => {
  // axios.get의 가짜(모킹된) 구현
  axios.get.mockResolvedValue({ data: 'some data' });

  // axios.get을 호출하는 코드 (예: API 호출)
  const response = await fetchData();

  // 테스트 검증
  expect(response.data).toEqual('some data');
});

 

3. expect 문법

expect 문법을 사용하여 테스트 케이스에서 간편하게 assertion을 작성할 수 있습니다. 다양한 matcher 함수를 제공하여 다양한 조건을 검증할 수 있습니다. 아래는 toHaveStyle matcher를 사용하였습니다. 

매개변수의 스타일이 있는지 확인

 

4. 병렬 실행 및 자동화

병렬로 테스트를 실행하므로 빠른 속도로 결과를 얻을 수 있습니다. 또한, 파일 변경을 감지하고 자동으로 해당 파일에 대한 테스트를 실행하는 기능도 제공합니다.

 

5. Snapshot Testing

React 컴포넌트에 유용한 스냅샷 테스팅(snapshot testing)을 지원합니다. 초기 렌더링 결과물을 캡처하고 이후에 변경 사항이 발생했는지를 확인하여 UI의 예상치 못한 변경을 감지합니다.

 

6. 내장된 Code Coverage 지원

코드 커버리지를 확인할 수 있는 내장된 도구를 제공하여 테스트 스위트의 코드 커버리지를 측정하고 리포트로 확인할 수 있습니다.

 

이렇게 하면 Jest를 사용하여 프로젝트의 코드 커버리지를 수집하고 시각화할 수 있습니다. 코드 커버리지 리포트를 통해 테스트가 어떤 부분을 놓치고 있는지 또는 어떤 부분이 충분히 테스트되었는지를 확인할 수 있습니다.

 

7. 다양한 확장성

Jest는 다양한 확장성을 제공하여 필요에 따라 커스터마이징이 가능합니다. 플러그인이나 확장 모듈을 사용하여 테스트 환경을 확장할 수 있습니다.

 

 

 

References

https://github.com/testing-library/jest-dom