최근에 팀 내 저장소 패키지 버전 올리는 작업을 하던 중 테스트 코드가 갑자기 깨져버렸습니다. 문제는 Axios 1.6.8을 1.7.0로 업데이트하면서 발생했습니다.

Axios 1.7.0으로 업데이트한 후, Jest에서 TextEncoder is not defined 에러가 발생했습니다. 이 문제는 jsdom 라이브러리가 실제 브라우저 환경을 재현하기 위해 Node.js global을 덮어씌우는 과정에서 TextEncoder가 추가되지 않아 발생하는 문제였습니다.

2019년에 jsdom 저장소에서 이미 이슈(https://github.com/jsdom/jsdom/issues/2524) 로 제기된 문제지만, 아직까지 해결되지 않고 있습니다. 그러나 다행히도 최근 Axios 1.7.1 버전에서는 TextEncoder 미지원 환경에 대한 fallback 처리가 추가되어, 현재는 문제없이 사용이 가능합니다.

한편, MSW 2.x 버전에서도 동일한 이슈가 발생한다고 합니다. 이 경우, MSW 공식 문서(https://mswjs.io/docs/migrations/1.x-to-2.x/#requestresponsetextencoder-is-not-defined-jest) 에서 제공하는 해결 방법을 따라하시면 해결이 가능합니다. 참고로 가이드엔 jest.polyfill.js로 나와있는데 폴더에 setupTests.js 파일이 있으시면 아래 코드를 추가해서 간단하게 해결이 가능합니다.

const { TextDecoder, TextEncoder } = require('node:util')

Object.defineProperties(globalThis, {
  TextDecoder: { value: TextDecoder },
  TextEncoder: { value: TextEncoder }
})