デバッグ

ヒント

テストをデバッグする場合は、--test-timeout CLI 引数を使用して、ブレークポイントで停止したときにテストがタイムアウトしないようにします。

VS Code

VS Code でテストをデバッグする簡単な方法は、JavaScript Debug Terminal を使用することです。新しい JavaScript Debug Terminal を開いて、npm run test または vitest を直接実行します。これは Node で実行される任意のコードで機能するため、ほとんどの JS テストフレームワークで機能します

VS Code でテストファイルをデバッグするための専用の起動構成を追加することもできます

json

{
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Debug Current Test File",
      "autoAttachChildProcesses": true,
      "skipFiles": ["<node_internals>/**", "**/node_modules/**"],
      "program": "${workspaceRoot}/node_modules/vitest/vitest.mjs",
      "args": ["run", "${relativeFile}"],
      "smartStep": true,
      "console": "integratedTerminal"
    }
  ]
}

次に、デバッグタブで「現在のテストファイルをデバッグ」が選択されていることを確認します。デバッグするテストファイルを開いて F5 キーを押すと、デバッグを開始できます。

IntelliJ IDEA

「Node.js」実行構成を作成します。すべてのテストをデバッグモードで実行するには、次の設定を使用します

設定	値
作業ディレクトリ	`/path/to/your-project-root`
JavaScript ファイル	`./node_modules/vitest/vitest.mjs`
アプリケーションパラメーター	`run --pool forks`

次に、この構成をデバッグモードで実行します。IDE はエディターで設定された JS/TS ブレークポイントで停止します。

Node Inspector、例: Chrome DevTools

Vitest は IDE を使用せずにテストをデバッグすることもサポートしています。ただし、これにはテストが並列に実行されないことが必要です。Vitest を起動するには、次のコマンドのいずれかを使用します。

# To run in a single worker
vitest --inspect-brk --pool threads --poolOptions.threads.singleThread

# To run in a single child process
vitest --inspect-brk --pool forks --poolOptions.forks.singleFork

Vitest 1.1 以降を使用している場合は、--no-file-parallelism フラグを指定するだけで済みます

# If pool is unknown
vitest --inspect-brk --no-file-parallelism

Vitest が起動すると、実行が停止して開発者ツールを開くのを待ちます。開発者ツールは Node.js のインスペクターに接続できます。ブラウザで chrome://inspect を開くと、Chrome DevTools を使用できます。

ウォッチモードでは、--poolOptions.threads.isolate false オプションを使用することで、テストの再実行中にデバッガーを開いたままにすることができます。

デバッグ ​

VS Code ​

IntelliJ IDEA ​

Node Inspector、例: Chrome DevTools ​

デバッグ

VS Code

IntelliJ IDEA

Node Inspector、例: Chrome DevTools