vitest について
vitestは、Viteプロジェクトでテストを扱う開発者向けのスキルです。テスト作成、設定、モック、カバレッジ、ブラウザモード、移行を、Vitest 5.xを前提に案内します。
主な機能
- 01Vitestの設定とテスト実行の案内
- 02モック、タイマー、スナップショットの解説
- 03カバレッジとブラウザモードの説明
- 04プロジェクト、プール、レポーターの案内
- 05JestおよびVitestのバージョン移行支援
活用シーン
- 01Viteプロジェクトでのテスト作成や実行
- 02モック、スナップショット、カバレッジ設定の調整
- 03ブラウザテストや移行時の問題調査
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ dobroslavradosavljevic/ skills --skill vitestインストール後、Claude Code で/vitestを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
agents/openai.yamlreferences/config-cli-api.mdcoverage-browser-projects.mdmigration.mdmocking-snapshots.mdsource-map.mdusage-guide.md詳細
Vitest
Vitest に関連する作業(テストの作成・実行、設定、モック/スナップショット、カバレッジ、ブラウザモード、プロジェクト/プール、レポーター、Jest/Vitest 3/Vitest 4 からの移行)では、このスキルを使用してください。
スナップショット:[email protected](2026-10-01)。バージョンが異なる場合は、source-map.md から更新してください。
ワークフロー
- ローカルの Vitest 環境を確認します。
- パッケージのバージョン:
vitestと、バージョンをそろえた@vitest/*(スナップショットは 5.0.3)。Node は^22.12 || ^24 || >=26。Vite のピア依存関係は^6.4 || ^7 || ^8(必須。Yarn ではviteを明示的に記載する必要があります)。 - 設定:専用の
vitest.config.*(vite.configを完全に上書き)と、Vite 設定内のtest: {}のどちらかを確認します。設定は親ディレクトリから検索されません。 - スクリプト:CI では
vitest runを推奨します。プロジェクトで Vitest を使用している場合、Bun のテストランナーであるbun testは使用せず、bun run test/bunx vitestを使用してください。 - 環境:
node(デフォルト)、jsdom/happy-dom、または Browser Mode プロジェクトのいずれかを確認します。 - 成果物:プロジェクトのルートにある
.vitest/(gitignore に追加してください)。
- パッケージのバージョン:
- 日常的な使用方法については、まず usage-guide.md に従ってください。
- バージョンに差異がある場合、または作業がブラウザ/カバレッジ/移行に関する場合は、ドキュメントを更新してください。source-map.md から始めてください。
- 詳細については、以下を参照してください。
- 設定、CLI、テスト API、環境、セットアップ:config-cli-api.md。
viのモック、vi.when、タイマー、環境変数のスタブ、スナップショット:mocking-snapshots.md。- カバレッジ、ブラウザモード、プロジェクト、プール、レポーター、ベンチ:coverage-browser-projects.md。
- Jest / Vitest 3 → 4 / 4 → 5:migration.md。
- Vitest 5.x の API を優先してください(デフォルトで
extends: trueのprojects、maxWorkers、ブラウザプロバイダーファクトリー、テストコンテキストのフィクスチャとしてのbench、vi.when)。@vitest/*パッケージはvitestと同じバージョンにしてください。 - 必要最小限のコマンド(
vitest run path -t "name"、カバレッジ、またはブラウザプロジェクト)で検証してください。プール/分離/キャッシュの調整を行う場合に限り、vitest doctorを使用してください。
基本的な判断基準
- Vitest は Vite を基盤とするテストランナーで、Jest 互換の API を備えています。Bun に組み込まれた
bun testではありません。 - CI /フックでは、必ず
vitest run(または--run)を使用してください。通常のvitestはウォッチモードになり、CI/非 TTY によって実行モードが強制されない限り、非対話環境では終了しません。 globals: trueを設定していない限り、vitestからインポートしてください。エージェントがコードを明確に把握できるよう、明示的なインポートを推奨します。vi.mock/vi.unmock/vi.hoistedは巻き上げられるため、トップレベルに記述する必要があります。入れ子にするとエラーになります。ファクトリーから、巻き上げられていないローカル変数を参照することはできません。clearMocksのデフォルトはtrueです(各テストの前に呼び出し履歴がクリアされ、実装は保持されます)。モックを共有する並行テストでは、clearMocks: falseが必要になる場合があります。- 並行テストとスナップショット/アサーションを併用する場合は、グローバルな
expectではなく、テストコールバックから取得するコンテキストのexpectを使用してください。 resolves/rejects/toMatchFileSnapshot/expect.pollは、必ずawaitしてください。非同期アサーションを待機しないと、テストは失敗します。- デフォルトのプールは
forksです。ネイティブアドオンで問題が発生する場合は、threadsよりもこちらを推奨します。 - 専用の
vitest.config.*はvite.configのオプションを無視します。Vite のプラグイン/エイリアスを拡張する場合は、mergeConfigを使用してください。 - インラインの
test.projectsはルート設定を継承し(デフォルトはextends: true)、Vite サーバーを共有することがあります。ファイル/ディレクトリ形式のプロジェクトは継承しません。 - プロジェクトでのカバレッジ設定はルートのみです。
coverage.includeを明示的に設定してください。パターンはプロジェクトのルートからの相対パスに対して照合されます(containsはありません)。 - Browser Mode は
environment: 'jsdom'ではありません。browser.enabledとプロバイダーパッケージを使用してください。ロケーターはデフォルトで完全一致です。 benchはトップレベルからインポートできません。*.bench.*ファイル内で{ bench }フィクスチャを使用してください。- Vite はテストを変換しますが、型チェックは行いません。必要に応じて
typecheckまたはプロジェクトのtscを別途使用してください。
検証
リポジトリで定義されているコマンドを優先してください。Vitest に関する重要な作業では、関連する範囲をカバーしてください。
bunx vitest --versionを実行し、@vitest/*のバージョンが揃っていることを確認します。vitest run <file> -t "<name>"(または:lineフィルター)で対象を絞って実行します。完全な名前では>を使います(-t 'suite > test')。- スナップショットの更新には、意図的に
-uまたは watch モードのuのみを使い、差分を確認します。 - カバレッジのしきい値やレポートが重要な場合は、
vitest run --coverageを実行します。 - ブラウザープロジェクト:UI/コンポーネントのテストを変更した場合は、ヘッドレス Chromium でスモークテストを実行します。
- 移行:
workspace、文字列形式のブラウザープロバイダー、poolOptions、test(name, fn, options)、ネストされたvi.mock、トップレベルのbenchインポート、test.sequential、browser.apiが残っていないことを確認します。
実行したチェック、実行しなかったチェック、および残っている Vitest のバージョンに関する前提を報告してください。
コメント
Markdown 対応