Chrome 확장 프로그램 단위 테스트

단위 테스트를 사용하면 작은 코드 섹션을 나머지 부분과 별도로 테스트할 수 있음 확장 프로그램 간에도 액세스할 수 있습니다 예를 들어, 단위 테스트를 작성하여 스토리지에 값을 올바르게 쓰는지 확인할 수 있습니다.

확장 프로그램 API를 사용하지 않고 작성된 코드는 Jest와 같은 프레임워크를 사용하여 평소와 같이 테스트할 수 있습니다. 이러한 방식으로 코드를 더 쉽게 테스트하려면 하위 수준 구현에서 Chrome 네임스페이스에 대한 종속 항목을 삭제하는 데 도움이 되는 종속 항목 삽입과 같은 기법을 사용하는 것이 좋습니다.

확장 프로그램 API가 포함된 코드를 테스트해야 하는 경우 모의 API를 사용하는 것이 좋습니다.

예: Jest에서 모의 사용

모든 테스트 전에 실행할 설정 파일을 선언하는 jest.config.js 파일을 만듭니다.

jest.config.js:

module.exports = {
  setupFiles: ['<rootDir>/mock-extension-apis.js']
};

mock-extension-apis.js에서 호출할 특정 함수의 구현을 추가합니다.

mock-extension-apis.js:

global.chrome = {
  tabs: {
    query: async () => { throw new Error("Unimplemented.") };
  }
};

그런 다음 jest.spy를 사용하여 테스트에서 반환 값을 모의 처리합니다.

test("getActiveTabId returns active tab ID", async () => {
  jest.spyOn(chrome.tabs, "query").mockResolvedValue([{
    id: 3,
    active: true,
    currentWindow: true
  }]);
  expect(await getActiveTabId()).toBe(3);
});

다음 단계

확장 프로그램이 예상대로 작동하는지 확인하려면 엔드 투 엔드 테스트를 추가하는 것이 좋습니다. 전체 가이드는 Puppeteer로 Chrome 확장 프로그램 테스트를 참조하세요.