Reactガイドを読んでいくその280
これは
Reactのガイドを読んでいく記事です。
ガイドのリンク
テストのレシピ集
セットアップ/後始末
通常Reactツリーをdocumentに結び付いたDOM要素として描画する。
テスト終了後にクリーンアップを行いdocumentからツリーをアンマウントする。
よく使われるものとしてbeforeEachとafterEachブロックのペアを使い常に実行することでテストの副作用がそれ自身にとどまる。
import { unmountComponentAtNode } from "react-dom"; let container = null; beforeEach(() => { // setup a DOM element as a render target container = document.createElement("div"); document.body.appendChild(container); }); afterEach(() => { // cleanup on exiting unmountComponentAtNode(container); container.remove(); container = null; });
他のパターンを利用するとしてもクリーンアップコードは必ず実行するべき。
クリーンアップを忘れるとそこに穴ができてしまい、デバッグが困難になってしまう。
今日はここまで。