グーグルは最近、「Chrome DevTools MCP」のベータ版をリリースしました。これはモデルコンテキストプロトコル（MCP）サーバーであり、AIコードエージェントが実際のChromeブラウザインスタンスを制御・検査できるようにします。このツールはパフォーマンスデータの記録、DOMやCSSのチェック、JavaScriptの実行、コンソール出力の読み取り、ユーザー処理の自動化などを行うことができます。

image.png

このリリースは、コード生成エージェントにおける一般的な限界に直接対応しています。それは、通常、作成または変更されたページの実行時の挙動を観察できないという点です。DevToolsと接続することで、グーグルは静的な提案エンジンを、ブラウザ内で測定を行い修正案を提示する閉ループデバッガーに変革させました。

Chrome DevTools MCP とは一体何でしょうか？  

MCPは、大規模言語モデル（LLM）とツールおよびデータを接続するオープンプロトコルです。グーグルのDevTools MCPは、MCPに対応したクライアントに対してChromeのデバッグインターフェースを開く専用サーバーです。グーグル開発者ブログでは、「AIコードアシスタントにChrome DevToolsの強力な機能を提供する」と説明されており、例えばパフォーマンストラッキング（performance_start_trace）を開始し、エージェントが結果を分析して最適化案（最大コンテンツ描画の診断など）を提示するなどの具体的なワークフローが提供されています。

機能とツール  

公式のGitHubリポジトリには広範なツールセットがリストされています。パフォーマンストラッキングだけでなく、ナビゲーションプリミティブ（navigate_page、new_page、wait_for）、ユーザー入力のシミュレーション（click、fill、drag、hover）、実行時状態のチェック（list_console_messages、evaluate_script、list_network_requests、get_network_request）も可能です。スクリーンショットとスナップショットツールは視覚的およびDOM状態のキャプチャを提供し、差分比較や回帰テストをサポートします。このサーバーは下位レベルでPuppeteerを使用し、信頼性のある自動化と待機セマンティクスを実現し、Chrome DevToolsプロトコル（CDP）を通じてChromeと通信します。

インストールプロセス  

MCPクライアントの設定は非常に簡単です。グーグルはnpxを介して最新のサーバービルドを追跡するだけの構成セグメントを追加することを推奨しています：

json

{

  "mcpServers": {

    "chrome-devtools": {

      "command": "npx"，

      "args": ["chrome-devtools-mcp@latest"]

    }

  }

}

このサーバーは複数のエージェントフロントエンドと統合されています：Gemini CLI、Claude Code、Cursor、およびGitHub CopilotのMCPサポートなどです。VS Code/Copilotの場合、1行のコマンドでcode --add-mcpを実行できます。Claude Codeの場合、同じnpxターゲット呼び出しを行うclaude mcp addコマンドを使用します。このパッケージの対象はNode.js ≥22および現在のChromeバージョンです。

例としてのエージェントワークフロー  

グーグルの発表では、リアルタイムブラウザで修復案を検証し、ネットワーク障害（CORSやブロックされた画像要求など）を分析し、エラーを再現するためにフォーム送信などのユーザー動作をシミュレートし、DOM/CSSのコンテキストを確認してレイアウト問題をチェックし、最大コンテンツ描画を減らすための自動化されたパフォーマンスレビューを実行するなど、エンドツーエンドループの実用的なヒントが紹介されています。これらはすべて、今後、ヒューリスティックではなく実際の測定によって検証される操作です。

github：https://github.com/ChromeDevTools/chrome-devtools-mcp

ポイント：

🌟 ** 実時間制御 **: グーグルのChrome DevTools MCPは、AIエージェントが実際にChromeブラウザを制御・チェックできるようにします。

⚙️ ** 広範な機能 **: パフォーマンストラッキング、ユーザー入力のシミュレーション、実行時状態のチェックなどの機能をサポートしています。

🚀 ** 簡単なインストール **: ユーザーは単純な構成で、MCPサーバーを迅速に展開し、多数の開発ツールに統合することができます。