web-dev-qa-db-ja.com

Jestはすべてのスイートまたはテストの後にJSDOMドキュメントをリセットしますか？

マウントおよびアンマウント時にDOM構造の外部に到達するいくつかのコンポーネントをテストして、他の方法では実現できない特定の対話機能を提供しています。

JestとデフォルトのJSDOM初期化を使用して、ノード内にブラウザーのような環境を作成しています。 Jestがすべてのテスト実行後にJSDOMをリセットすることを示唆するドキュメントを見つけることができませんでした。そうでない場合に手動でそれを行う方法に関する明確なドキュメントはありません。

私の質問は、Jestはすべてのテスト、スイートの後にJSDOMインスタンスをリセットしますか、それともすべてのテスト実行でJSDOMの単一のインスタンスを保持しますか？もしそうなら、どうすればそれを制御できますか？

testingjestjsjsdom
16
Klemen Slavič

（誤解を招く）受け入れられた回答を修正し、前のコメントの1つからの非常に重要な情報を明確に強調するには：

いいえ。Jestしないでくださいテストを実行するたびにJSDOMドキュメントを削除してください！ファイル全体のすべてのテストが完了した後にのみ、DOMをクリアします。

つまり、リソースを手動でクリーンアップする必要がありますテスト中に、テストを1回実行するたびに作成されます。そうしないと、共有状態が発生し、非常に微妙なエラーが発生し、追跡が非常に困難になります。

以下は、jestテストスイート内の単一のテストごとにJSDOMをクリーンアップするための非常にシンプルでありながら効果的な方法です。

describe('my test suite', () => {
  afterEach(() => {
    document.getElementsByTagName('html')[0].innerHTML = ''; 
  });

  // your tests here ...
});
25
Rico Pfaus

すべてのjestテストファイルは独自のスレッドで実行されるため、それらの間では何も共有されません。そのため、テストの実行後にモックやスパイをリセットする必要はありません。 Jestページから：

Jestは、パフォーマンスを最大化するために、ワーカー間でテスト実行を並列化します。コンソールメッセージはバッファリングされ、テスト結果とともに印刷されます。 サンドボックステストファイルとすべてのテストの自動グローバル状態リセットにより、2つのテストが互いに競合することはありません。

1
Andreas Köberle

Rico Pfausは正しいですが、彼が示唆する方法でinnerHTMLをリセットすると、破壊的になりすぎてテストが失敗することがわかりました。代わりに、ドキュメントから削除したい特定の要素を（クラスまたはIDで）選択するほうが効果的です。

describe('my test suite', () => {
    afterEach(() => {
        document.querySelector(SOME CLASS OR ID).innerHTML = ''
    })
})
0
Maxi Clayton Clowes