kunchenguid/chrome-devtools-axi

The most agent-ergonomic browser automation

chrome‑devtools‑axi – エージェントフレンドリーな Chrome 自動化

何であるかchrome-devtools-axi は、chrome‑devtools‑mcp ライブラリ(Chrome DevTools Protocol に基づくヘッドレス Chrome コントローラ)をラップするコマンドラインツールであり、出力を AXI準拠 形式で提供します。AXI(Agent eXecution Interface)は大規模言語モデルエージェント向けに設計された軽量スキーマであり、この CLI は トークン効率 を最適化し、エージェントが明確かつ実行可能なヒントを得られるように調整されています。

AIエージェントにとって重要な点

  • 低トークンコスト – スナップショットは TOON 形式でエンコードされ、元の JSON と比べて約 40 % のトークン数削減(chrome‑devtools‑mcp の原始的な出力と比較して入力トークンが約 57 % 減少)。
  • 少ない相互作用のターン数 – 1 つのコマンドでナビゲーション、ページのキャプチャ、次のステップの提案が可能となり、LLM が行う必要のある往復呼び出しの回数を削減。
  • 組み込みのエコノミクス – 応答毎に「ヘルプ」ラインが含まれており、エージェントに次に実行すべきコマンド(例:click @g1:1)を明確に示す。
  • ベンチマーク実証済み – 公開された AXI ベンチマーク(14 の実世界のブラウジングタスク、Claude‑Sonnet‑4‑6 をエージェントとして使用)において、平均入力トークン数、コスト、実行時間、ターン数が最低でありながら 100 % の成功を達成。

動作方法

chrome‑devtools‑axi  (CLI) → HTTP (localhost:9224) → ブリッジサーバ(永続的な MCP セッション) → chrome‑devtools‑mcp → ヘッドレス Chrome
  • ブリッジ プロセスは CLI の呼び出し間で生き続け、Chrome を毎回再起動する必要がありません。
  • ブリッジは アクセシビリティツリー をキャプチャし、インタラクティブな要素の ID(uid= 参照)を抽出し、TOON でエンコードします。
  • コマンド(openclickfillevalscreenshotlighthouse など)は DevTools Protocol メッセージに変換され、コンパクトでエージェント用に最適化された JSON として結果が返されます。

インストールとクイックスタート

  1. エージェントスキルルート(推奨) – 1 つのコマンドで Claude/​Hermes 風のエージェントにスキルを追加。npm install は不要:
    npx skills add kunchenguid/chrome-devtools-axi --skill chrome-devtools-axi -g
    
    このスキルは、実際のブラウザが必要なタスクの際、エージェントに npx -y chrome-devtools-axi を介して CLI を呼び出すように指示します。
  2. 直接 CLI – グローバルインストールまたはオンザフライ実行:
    npm i -g chrome-devtools-axi   # または
    npx -y chrome-devtools-axi open https://example.com
    
  3. ソースから – クローンし、pnpm install --frozen-lockfilepnpm run build、その後 pnpm link

典型的なエージェントのやり取り

$ chrome-devtools-axi open https://example.com
page: {title:"Example Domain",url:"https://example.com",refs:1}
snapshot:
RootWebArea "Example Domain"
  heading "Example Domain"
  paragraph "This domain is for use in illustrative examples..."
  uid=g1:1 link "More information..."
help[1]: Run `chrome-devtools-axi click @g1:1` to click the "More information..." link

エージェントはその後 chrome-devtools-axi click @g1:1 を実行し、新しいスナップショットを受け取り、ワークフローを継続できます。

主要なコマンドグループ

  • ナビゲーションopen <url>backscrollwaiteval
  • インタラクションclick @uidfill @uid <text>typepresshoverdrag
  • ページ管理pagesnewpageselectpageclosepageresize
  • DevToolsデータconsolenetworklighthouseperf‑start/stopheap
  • ブリッジ制御startstopsetup hooks(Claude Code、Codex、OpenCode 用のセッション開始フックをインストール)。

設定オプション

  • CHROME_DEVTOOLS_AXI_PORT – カスタムブリッジポート。
  • CHROME_DEVTOOLS_AXI_BROWSER_URL – 既存の Chrome インスタンスに接続(HTTP または WS エンドポイント)。
  • CHROME_DEVTOOLS_AXI_CHANNEL – Chrome リリースチャネルを選択(stable、beta、canary、dev)。
  • CHROME_DEVTOOLS_AXI_SESSION – 複数の独立したブリッジセッションを並列で実行。
  • イソレーションフラグ(--use-mock-keychain--password-store=basic)により、起動されたブラウザが OS のキーチェーンにアクセスしないように保証。

誰が使うべきか

  • 可靠でトークン効率の良いブラウザ自動化を必要とする LLM駆動エージェント を開発する開発者。
  • Claude、Hermes、または任意の AXI準拠エージェントプラットフォームに 即時導入可能なスキル を求めているチーム。
  • プログラム可能な Chrome インターフェースを必要とし、プロンプトインジェクションに適した簡潔で構造化されたデータを返す必要があるすべての人。

上記のすべての詳細は、リポジトリの README から直接引用;追加機能は推測されていません。

関連

  • プロジェクト
  • プロジェクト
  • プロジェクト
  • プロジェクト
  • プロジェクト