1. ホーム
  2. reactjs

[解決済み] Jestテストが失敗する : TypeError: window.matchMedia is not a function.

2022-07-16 04:41:10

質問

初めてフロントエンドのテストを経験します。このプロジェクトでは、私はJestのスナップショットテストを使っていますが、エラーが発生しました。 TypeError: window.matchMedia is not a function というエラーが発生しました。

Jestのドキュメントを見てみると、quot;Manual mocks"のセクションがありましたが、それをどのように行うかについてはまだ何も考えていません。

どのように解決するのですか?

Jestのドキュメントに、quot;official"回避策が掲載されました。

Object.defineProperty(window, 'matchMedia', {
  writable: true,
  value: jest.fn().mockImplementation(query => ({
    matches: false,
    media: query,
    onchange: null,
    addListener: jest.fn(), // Deprecated
    removeListener: jest.fn(), // Deprecated
    addEventListener: jest.fn(),
    removeEventListener: jest.fn(),
    dispatchEvent: jest.fn(),
  })),
});

JSDOMに実装されていないモッキングメソッド