[解決済み] 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(),
})),
});
関連
-
[解決済み] バベルエラーです。JSX値は、式または引用されたJSXテキストのいずれかである必要があります。
-
[解決済み] React + TypeScript のエラーです。この呼び出しにマッチするオーバーロードがありません
-
[解決済み] Jestを使用して単一のテストを実行するにはどうすればよいですか?
-
[解決済み] Jestを使用して1つのファイルをテストするにはどうすればよいですか?
-
[解決済み] ReactコンポーネントのJest SnapshotテストにおけるSnapshotテストの仕組みとtoMatchSnapshot()関数は何をするのか?
-
[解決済み] Static HTML elements with event handlers require a role." を修正するにはどうすればよいですか?
-
[解決済み] componentWillReceivePropsライフサイクルメソッドはいつ使用するのですか?
-
[解決済み] 拡張子.tsと.tsxの違いは何ですか?どちらもreactのタイプスクリプトファイルの拡張子として使用されます。では、どこで使うべきなのでしょうか?
-
[解決済み] React QueryとReduxの主な違いは何ですか?
-
[解決済み] Jestの'it'と'test'の違いは何ですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】<Router>の外側で<Link>を使用してはならない
-
[解決済み】プリセットファイルはオブジェクトのエクスポートができない
-
[解決済み] SVGサークル内の画像にボーダーを追加する方法
-
[解決済み] Angular 2の*ngForのReactでの同等品
-
[解決済み] React - _this2.SetStateは関数ではありません。
-
[解決済み] react jsでウィンドウを開くイベントを処理するにはどうすればよいですか?
-
[解決済み] react-navigation v5を使ったreact-nativeアプリのAppNavigatorの構文を更新する。
-
[解決済み] React Router - バージョン更新後のwithRouterでTypescriptエラーが発生する。
-
[解決済み] React Hooksの「exhaustive-deps」lintルールを理解する
-
[解決済み] create-react-appビルドスクリプトを実行する際に、ビルド.env変数を設定するには?