概要
AIエージェントがWebフレームワークの内部状態やランタイム情報を直接取得・操作できるようにする、Chrome DevToolsの新しいサードパーティツール拡張機能が登場しました。
詳細内容
### 概要
Googleは、AIエージェントによるWebアプリケーションのデバッグ効率を向上させるため、Chrome DevToolsにサードパーティ製デベロッパーツールを統合する機能を導入しました。最新のWeb開発では抽象化が進んでおり、DOMだけでは把握できないフレームワーク内部の状態（コンポーネント階層、Signal、DIグラフなど）が重要です。この新機能により、ライブラリ開発者がAIエージェント専用の診断ツールを提供できるようになります。
### 技術的仕組み
- **Discovery API**: `devtoolstooldiscovery`イベントを通じて、ページ上のライブラリが自身のツール定義（名称、説明、入力スキーマ）をDevTools MCPサーバーに通知します。
- **MCP (Model Context Protocol) 連携**: エージェントはMCP経由で利用可能なツールをリストアップし、`execute_3p_developer_tool`を呼び出して、ページの実行コンテキストでツールを動かします。
- **高度な操作**: `evaluate_script`を使用することで、複数のステップを組み合わせたデバッグや、シリアル化不可能なDOM要素を含む複雑な処理をページ内で完結させることが可能です。
### 実装例と展望
Angularチームとの協力により、無限ループの特定に役立つ「シグナルグラフツール」や、静的解析では困難なプロバイダーエラーを特定する「依存性注入（DI）グラフツール」が既に実装されています。Reactチームとも実験が進められており、AI主導のデバッグ体験を根本から変えるプラットフォームを目指しています。