Chrome 拡張機能の単体テスト

単体テストでは、コードの小規模なセクションを他の部分から分離してテストできる ブラウザ外で行います。たとえば、Terraform がテストした問題を確実に ヘルパー メソッドがストレージに値を正しく書き込むことを確認します。

拡張機能 API を使用せずに記述されたコードは、Jest などのフレームワークを使用して通常どおりテストできます。このようにコードを簡単にテストできるようにするには、依存関係の注入などの手法の使用を検討してください。これにより、下位レベルの実装で Chrome 名前空間への依存関係を削除できます。

拡張機能 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 拡張機能のテストをご覧ください。