jest ReferenceError: TextEncoder is not defined

minseok baek·2024년 10월 1일

프로젝트

목록 보기

16/20

TextEncoder 오류 해결 및 테스트 환경에서 발생한 문제

테스트 코드를 검증하는 과정에서 갑자기 ReferenceError: TextEncoder is not defined라는 오류가 발생했습니다.

이 오류의 원인은 TextEncoder라는 글로벌 객체가 정의되지 않았기 때문입니다.

TextEncoder는 문자열을 UTF-8 바이트 배열로 인코딩하는 Web API로, 브라우저 환경에서 제공되는 객체입니다.

Node.js는 버전 11 이후부터 이를 자동으로 지원하므로 별도로 설정할 필요가 없습니다. 그러나 제가 사용하는 Node.js 버전이 20임에도 불구하고 이 오류가 발생하여 당황스러웠습니다.

다행히도 스택오버플로우를 통해 다양한 해결 방법을 찾을 수 있었습니다.

해결 방법

왜 이런 오류가 발생했을까?

Node.js 20을 사용하고 있음에도 불구하고 이런 글로벌 객체 오류가 발생한 이유를 여러 자료를 통해 찾아보았습니다. 일부 자료에 따르면, fnm과 같은 패키지 매니저를 사용할 경우 버전 충돌로 인해 문제가 발생할 수 있다고 했지만, fnm 버전을 변경해도 문제는 해결되지 않았습니다.

방법 1 : text-encoding 라이브러리 설치

jestSetup 파일 상단에 아래 코드를 추가하는 방법이 있습니다. 그러나 저의 경우에는 이 방법이 효과가 없었습니다.

/jestSetup 
import { TextEncoder, TextDecoder } from 'text-encoding';

global.TextEncoder = TextEncoder;
global.TextDecoder = TextDecoder;

방법 2 : util 모듈 사용 !!!!!!

제가 해결한 방법은 별도의 의존성을 설치하지 않고, Node.js에서 제공하는 util 모듈을 사용하는 것이었습니다.

import { TextEncoder } from 'util';
global.TextEncoder = TextEncoder;

새로운 오류

TextEncoder 문제는 해결되었지만, 이후 ReferenceError: Request is not defined 라는 새로운 오류가 발생했습니다. 이는 fetch가 지원되지 않아서 발생한 문제였으며, whatwg-fetch 폴리필 라이브러리를 설치하여 해결했습니다.