axios의 .catch()를 테스트하기 위해 Axios를 모킹하는 방법 이해하기
axios 호출에 대한 테스트를 작성할 때, 성공 (then) 및 실패 (catch) 시나리오 모두를 다루는 것이 중요합니다. 그러나 catch 부분을 테스트하기 위해 axios 호출을 모킹하는 것은 조금 까다로울 수 있습니다. 이 블로그 포스트에서는 catch 블록을 테스트하기 위해 axios를 모킹하는 다양한 접근 방법을 탐색해 보겠습니다.
catch 블록을 테스트하는 것의 중요성
catch 블록은 axios 호출이 실패할 때 오류 처리와 대체 동작을 다루는 데 핵심적인 역할을 합니다. 오류 시나리오에서 코드가 올바르게 동작하는지 확인하는 테스트가 필요합니다. axios 호출을 모킹함으로써 다양한 오류 응답을 시뮬레이션하고 catch 블록이 예상대로 실행되는지 확인할 수 있습니다.
Jest로 Axios 모킹하기
Jest를 사용하여 axios를 모킹하는 일반적인 접근 방법으로 jest.mock 함수를 사용할 수 있습니다. 그러나 모킹의 기본 구현은 항상 해결된 Promise을 반환하므로 catch 블록을 테스트할 수 없습니다.
이 제약을 극복하기 위해 테스트 파일에서 axios의 get 함수를 수동으로 모킹할 수 있습니다. 다음은 예시입니다:
import axios from 'axios';
jest.mock('axios');
axios.get.mockRejectedValueOnce(new Error('네트워크 오류'));
// 테스트 코드의 나머지 부분
이 예시에서는 jest.mock을 사용하여 axios 모듈을 모킹하고, mockRejectedValueOnce를 사용하여 get 함수가 선택한 오류로 거부되도록 지정합니다. 이를 통해 catch 블록을 테스트하고 오류 처리 로직을 확인할 수 있습니다.
catch 블록 테스트하기
이제 axios 호출을 오류를 던지도록 모킹했으니, catch 블록이 정상적으로 실행되는지 확인하는 테스트를 작성해 보겠습니다. 다음은 예시입니다:
// axios 호출이 오류를 던지도록 모킹
axios.get.mockRejectedValueOnce(new Error('네트워크 오류'));
// axios 호출을 포함하는 함수 호출
try {
await fetchBundlesFromApi('?params');
} catch (error) {
// 오류가 올바르게 잡혀있는지 확인
expect(error.message).toBe('네트워크 오류');
}이 테스트에서는 axios 호출에서 던져진 오류를 잡고, 오류 메시지가 기대한 값과 일치하는지 단언합니다. 또한 사용자를 다른 페이지로 리디렉션하는 등 catch 블록에서 발생해야 할 대체 동작을 확인하는 좋은 기회입니다.
결론
axios 호출의 catch 블록을 테스트하는 것은 오류 처리와 대체 메커니즘이 의도대로 작동하는지 확인하기 위해 중요합니다. Jest를 사용하여 axios를 모킹하고 오류를 시뮬레이션함으로써 catch 블록을 자신있게 테스트하고 믿을 수 있는 테스트 커버리지를 확보할 수 있습니다. 다양한 오류 시나리오를 시뮬레이션하기 위해 mockRejectedValueOnce를 사용하여 테스트 파일에서 axios 함수를 수동으로 모킹하는 것을 기억해주세요.
이러한 기술을 익힘으로써 코드베이스에서 오류 처리 로직을 효과적으로 검증하고, 더 견고하고 신뢰할 수 있는 애플리케이션을 제공할 수 있습니다.
즐거운 테스트하세요!
