[vitest]: 一時的にモックしたコンポーネントを無効化するメモ

[vitest]: 一時的にモックしたコンポーネントを無効化するメモ

モックしたコンポーネントのテストカバレッジが表示されなくなったので一時的にモックを解除する方法を調べたときのメモ

モック化の解除

こんな感じで単純なコンポーネントのモックを作成したとする。

モックをまとめたファイル.tsx

vi.mock("@/components/Common/section", () => ({
  Section: ({ ...props }) => <div data-testid="section" {...props} />,
}));

下記のように書けば一時的に無効化できる。

テスト.test.tsx

vi.unmock("@/components/Common/section");

// importなどなど
import { Section } from "@/components/Common/section";

// 以降にテストコードが続く

unmock

• どこに書いてもコードの一番上に巻き上げられる
• setupFilesなどにある共通したモックを解除するのに良いのかも？

doUnmock

• 巻き上げられない
• すでにインポートされたモジュールは影響を受けず、doUnmock以後の動的インポートを検出すると解除される?
• テスト内のあるテストケース以降や動的にモックを解除したいときに有効そう

最後に

間違っていることがあれば、コメントに書いていただけると幸いです。
よろしくお願いいたします。