web-dev-qa-db-ja.com

.getContext（）が実装されていないため、単体テストでエラーが発生する

Canvas要素を使用するコンポーネントのJestを使用したテストを書いています。このようなテストを実行すると、エラーが発生し続けます。

Error: Not implemented: HTMLCanvasElement.prototype.getContext (without installing the canvas npm package)

私の理解から、Jestはテストにjsdomを使用しており、canvasまたはcanvas-prebuiltパッケージをインストールすると、jsdomはcanvasと互換性があります。

これらの各パッケージをインストールしようとしましたが、どちらもエラーを解決していません。私が間違っていると思う唯一のことは、jsdomがcanvasまたはcanvas-prebuiltパッケージを見つけられないことです。このエラーを修正する方法、またはjsdomが他のパッケージを見つけているかどうかをテストする方法を誰かが知っていますか？どうもありがとう！

javascriptcanvasjestjsjsdom
16
lpie88

関数の独自のモックを jestセットアップスクリプト で作成できます。

HTMLCanvasElement.prototype.getContext = () => { 
  // return whatever getContext has to return
};
20
Red Mercury

私のJestテストで同様の問題があり、 jest-canvas-mock をインストールすることで解決しました。

5
ElectroBuddha

上記の両方の答えが機能します。ただし、create-react-appの場合にそれを追加したいだけで、jest-canvas-mockのpackage.jsonのjest confで必要な「setupFiles」をサポートしていません。

Canvas要素（私の場合3）を呼び出している各テストファイルにimportステートメントを追加することで、これを回避しました。次に、importステートメントをsetupTests.jsファイルに移動し、その要件も削除しました。

1
Amrita Yadav