| name | browser |
| description | chrome-devtools-mcp の CLI (`chrome-devtools`) を使ったブラウザ操作の総合スキル。既存ブラウザに attach するかテスト用ブラウザを起動するかをユーザーに必ず確認した上でサーバを立ち上げ、スナップショット取得・クリック・入力・ナビゲーション・スクショ・ネットワーク監視などを行う。 |
| allowed-tools | Bash, Read, AskUserQuestion |
chrome-devtools-mcp の CLI (chrome-devtools) でブラウザを起動し、その後の操作までカバーする。
1. 接続先の確認 (毎回必須)
chrome-devtools status で状態を確認した後、起動済みでも未起動でも、必ず AskUserQuestion で接続先をユーザーに確認してから操作に入る。起動済みサーバが意図と異なる構成のまま使うのは事故の元なので、毎回 stop → start で整える。
選択肢は 2 つだけ:
- 既存ブラウザに接続: いま開いている Chrome に attach。実セッション (ログイン状態・拡張・タブ) を使いたいとき
- テスト用ブラウザを起動: 新規 user-data-dir で隔離された Chrome (デフォルト挙動)
既存ブラウザに接続
前提: Chrome 144+ で chrome://inspect/#remote-debugging の「Allow remote debugging for this browser instance」が ON。
DevToolsActivePort から port (1 行目) と WS path (2 行目) を読み、--wsEndpoint で接続する:
chrome-devtools stop 2>/dev/null
chrome-devtools start --wsEndpoint "ws://127.0.0.1:${PORT}${WS_PATH}"
chrome-devtools list_pages
初回接続時は Chrome 側に承認ダイアログが出ることがある。list_pages で既存タブが見えなければユーザーに承認を促す。
DevToolsActivePort が読めない場合 (Chrome を --remote-debugging-port=N で別プロファイル起動しているケース等) は AskUserQuestion で port を聞く。
テスト用ブラウザを起動
chrome-devtools stop 2>/dev/null
chrome-devtools start
chrome-devtools list_pages
2. AI ワークフロー
- Inspect:
take_snapshot で要素の <uid> を取得
- Act:
click / fill / navigate_page 等で操作。状態はコマンド間で永続
- 操作後の状態が必要なら、各操作コマンドに
--includeSnapshot true を付ける
接続確立後は同一セッション中サーバが永続するので、都度 start / status / stop を呼ぶ必要はない。
スナップショット例:
uid=1_0 RootWebArea "Example Domain" url="https://example.com/"
uid=1_1 heading "Example Domain" level="1"
3. コマンドリファレンス
カテゴリ別の使用例は assets/commands.md を参照 (Input Automation / Navigation / Emulation / Debugging / Network / Performance / Extensions / Service Management / Experimental)。各コマンドは --help で詳細を確認できる。
注意事項
- 接続中は Chrome 上に「Chrome is being controlled by automated test software」バナーが表示される
navigate_page の URL 指定は navigate_page url --url "<URL>" (positional type + --url)
- Experimental ツール (
click_at / screencast_* / list_webmcp_tools) は start 時に該当フラグ (--experimentalVision / --experimentalScreencast / --experimentalWebmcp) が必要