Vitest 実行ガイド

目的

フロントエンド（TypeScript / JavaScript）のユニットテストを Vitest で実行する方法を説明します。

配置規約

• テストはソースの隣にコロケートする（*.test.ts / *.test.tsx / *.test.js）
• 対象パスは vitest.config.ts の include に従う:
  • core_src/**/*.test.{ts,tsx,js}
  • tests/**/*.test.{ts,tsx,js}
• __tests__/ ディレクトリは使わない（既存規約に合わせる）
• Playwright の E2E（tests/e2e/*.spec.js）は Vitest の対象外

実行コマンド

用途	コマンド
Vitest のみ	npx vitest run
プロジェクトの test スクリプト	npm test

npm test は次を順に実行します。

1. build:paid-article-admin
2. vitest run
3. test:dbml-subsets（Node 組み込みテスト。Vitest ではない）

開発中の確認は npx vitest run で十分なことが多いです。CI や PR 前の通し確認では npm test を使います。

設定

• 設定ファイル: リポジトリ直下の vitest.config.ts
• 環境: jsdom
• globals: true（describe / it / expect を import なしでも利用可。既存テストは明示 import も可）
• React フックのテストでは @testing-library/react の renderHook を使う
• @wordpress/element を使うフックは、既存パターンどおり vi.mock('@wordpress/element', () => import('react')) で React に差し替える

CI

CI Quality Gate（.github/workflows/ci-quality-gate.yml）の Run Vitest ステップで npm run test が実行されます。

• PR の opened / reopened / ready_for_review、または Actions の Run workflow で起動する
• 追加 push（synchronize）では自動起動しない（CI 運用方針）

関連

• テスト・品質確認ガイド
• コマンド一覧
• Playwright E2E 実行ガイド