Skip to content

非公式本サイトは非公式の日本語ドキュメントであり、Cloudflare 公式サイトではありません。最新情報はdevelopers.cloudflare.comをご確認ください。

デバッグ

最終更新 Markdown で表示Agent セットアップ

このガイドでは、Vitest と @cloudflare/vitest-plugin を使って Workers のテストをデバッグする方法を説明します。

Vitest でインスペクターを開く

デバッグを始めるには、次のコマンドで Vitest を実行し、ポート 9229 にデバッガーを接続します。

vitest --inspect --no-file-parallelism

インスペクターのポートを変更する

既定では、インスペクターはポート 9229 で開きます。別のポート(例: 3456)を使う場合は、次のコマンドを実行します。

vitest --inspect=3456 --no-file-parallelism

または、Vitest の設定ファイルで指定できます。

import { cloudflareTest } from "@cloudflare/vitest-plugin";
import { defineConfig } from "vitest/config";

export default defineConfig({
	plugins: [
		cloudflareTest({
			// ...
		}),
	],
	test: {
		inspector: {
			port: 3456,
		},
	},
});

VS Code でブレークポイントを使う

Worker のテストでブレークポイントデバッグを行うには、次の設定を含む .vscode/launch.json を作成します。

{
	"configurations": [
		{
			"type": "node",
			"request": "launch",
			"name": "Open inspector with Vitest",
			"program": "${workspaceRoot}/node_modules/vitest/vitest.mjs",
			"console": "integratedTerminal",
			"args": ["--inspect=9229", "--no-file-parallelism"]
		},
		{
			"name": "Attach to Workers Runtime",
			"type": "node",
			"request": "attach",
			"port": 9229,
			"cwd": "/",
			"resolveSourceMapLocations": null,
			"attachExistingChildren": false,
			"autoAttachChildProcesses": false
		}
	],
	"compounds": [
		{
			"name": "Debug Workers tests",
			"configurations": [
				"Open inspector with Vitest",
				"Attach to Workers Runtime"
			],
			"stopAll": true
		}
	]
}

Run & Debug パネル上部で Debug Workers tests を選び、Vitest のインスペクターを開き、Workers ランタイムにデバッガーを接続します。続いてテストファイルにブレークポイントを追加し、デバッグを始めます。

役に立ちましたか?