Chrome拡張機能とブラウザ統合

15-20分⭐⭐☆☆☆

このモジュールで学ぶこと

  • Agent Managerの画面構成
  • Settings(設定)の詳細
  • Chrome拡張機能のインストール方法
  • ブラウザ統合の動作確認

学習目標

このモジュールを終えると、以下のことができるようになります:

  • Agent Managerの各機能を理解している
  • 設定項目の意味を理解し、必要に応じて変更できる
  • Chrome拡張機能をインストールできる
  • エージェントにブラウザ操作を指示できる

目次


事前準備

必要なもの

  • Google Antigravityがインストール済み(モジュール01完了)
  • Googleアカウントでサインイン済み

セクション1: Agent Managerの画面構成

1.1 Agent Managerを開く

エディタ画面の中央にある「Open Agent Manager」ボタンをクリックします。

Agent Manager画面

1.2 画面構成

Agent Managerは以下の要素で構成されています:

左サイドバー

項目説明
Inbox会話履歴の一覧。進行中・完了したタスクを管理
Start conversation新しい会話を開始
Workspacesプロジェクトフォルダの管理
Playground実験用の隔離環境。ファイルに影響を与えずにテスト可能

下部メニュー

項目説明
Knowledgeナレッジベース(再利用可能なコンテキスト)
Browserブラウザ統合機能
Settings各種設定
Provide Feedbackフィードバック送信

1.3 画面切り替え

  • Ctrl + E(Windows)/ Cmd + E(Mac)でAgent Manager ↔ Editor を切り替え

チェックポイント

  • Agent Manager画面を開けた
  • 左サイドバーの各項目を確認した

セクション2: Settings(設定)の詳細

左下の「Settings」をクリックして設定画面を開きます。

2.1 Agent設定

Agent設定

ARTIFACT(成果物)

設定オプション説明
Review PolicyAlways Proceedエージェントがレビューを求めない
Agent Decidesエージェントが判断(推奨)
Request Review常にレビューを求める

TERMINAL(ターミナル)

設定オプション説明
Terminal Command Auto ExecutionOff許可リスト以外は実行しない
Autoエージェントが判断(推奨)
Turbo拒否リスト以外は全て実行
Allow List-自動実行を許可するコマンド
Deny List-実行前に確認を求めるコマンド

FILE ACCESS(ファイルアクセス)

設定説明推奨
Agent Gitignore Access.gitignoreファイルへのアクセスOFF
Agent Non-Workspace File Accessワークスペース外ファイルへのアクセスOFF
Auto-Open Edited Files編集ファイルを自動で開くON

AUTOMATION(自動化)

設定説明推奨
Agent Auto-Fix LintsLintエラーを自動修正ON
Auto-Continue応答制限時に自動継続OFF

GENERAL(一般)

設定説明推奨
Enable Agent Web ToolsWeb検索・URL読み取りON
Open Agent on Reload再読み込み時にAgentパネル表示ON

2.2 Browser設定

Browser設定

GENERAL

設定説明推奨
Enable Browser Toolsブラウザ操作機能の有効化ON
Browser Javascript Execution PolicyJS実行ポリシーModel Decides

ALLOWLIST

設定説明
Browser URL Allowlistアクセス許可URLをファイルで管理

ADVANCED

設定説明デフォルト
Chrome Binary PathChromeの実行ファイルパス空(自動検出)
Browser User Profile Pathブラウザプロファイルの保存先~/.gemini/antigravity-browser-profile
Browser CDP PortChrome DevTools Protocolのポート9222

2.3 Editor設定

Editor設定

設定説明
Marketplace Item URL拡張機能のURL
Marketplace Gallery URL拡張機能ギャラリーのURL
Editor SettingsVS Codeスタイルの詳細設定

2.4 Tab設定(コード補完)

Tab設定

SUGGESTIONS

設定説明推奨
Suggestions in Editor入力時に補完を表示ON
Tab Speed補完の速度Fast
Highlight After Accept補完後にハイライトON
Tab to ImportTabキーでインポート追加ON
設定説明推奨
Tab to Jump次の編集位置に移動ON

CONTEXT

設定説明推奨
Clipboard Contextクリップボードをコンテキストに使用OFF
Tab Gitignore Access.gitignoreへのアクセスOFF

2.5 Notifications設定

Notifications設定

設定説明
Notification SettingsOSのシステム設定で管理

チェックポイント

  • Settings画面を開けた
  • Agent設定の項目を確認した
  • Browser設定で「Enable Browser Tools」がONになっている

セクション3: Chrome拡張機能のインストール

3.1 ブラウザ操作をリクエスト

  1. Agent Managerの左サイドバーで「Playground」の横にある + をクリック
  2. 新しい会話で以下を入力:
Open a browser and go to google.com
  1. エージェントが処理を開始します

ブラウザ操作リクエスト

3.2 Browser Setupの開始

エージェントがブラウザを使用しようとすると、以下のメッセージが表示されます:

"Antigravity would like to use the browser."

Setup」ボタンをクリックします。

3.3 Browser Setup画面

Browser Setup

説明文:

"Bring the Antigravity agent into your browser to see and interact with websites. It empowers the agent to test features, intelligently monitor dashboards, and seamlessly handle routine browser tasks."

Install extension →」ボタンをクリックします。

3.4 Chrome Web Storeでインストール

Chrome Web Store

Antigravity Browser Extensionのページが開きます:

  • 評価: 4.0 ★(268件の評価)
  • カテゴリ: 拡張機能、デベロッパー ツール
  • ユーザー数: 400,000+

Chrome に追加」ボタンをクリックしてインストールします。

3.5 インストール完了

インストールが完了すると、Antigravityに戻り、エージェントがブラウザ操作を実行します。

ブラウザ操作成功

成功すると以下が表示されます:

  • Goal: 実行したタスクの目標
  • Opened URL in Browser: 開いたURL
  • Playback available: 操作の録画(Viewで確認可能)

チェックポイント

  • Playgroundで会話を開始できた
  • Browser Setup画面が表示された
  • Chrome拡張機能をインストールした
  • ブラウザ操作が成功した

セクション4: ブラウザ統合の確認

4.1 Browser Control画面

左下の「Browser」をクリックすると、Browser Controlの説明画面が表示されます。

Browser Control

エージェントができること

  • クリック: ボタン、リンクをクリック
  • スクロール: ページをスクロール
  • 入力: フォームにテキスト入力
  • ナビゲーション: ページ間の移動

ユースケース例

用途説明
Webサイトデザインの反復開発中のサイトをリアルタイムで確認・修正
QAテストフォーム送信、エラーハンドリングの検証
ダッシュボード監視定期的なデータ確認
ルーティンタスク自動化CI再実行などの定型作業

4.2 ブラウザ操作のテスト

より複雑な操作をテストしてみましょう。Playgroundで以下を入力:

Go to google.com, search for "Antigravity Google", and take a screenshot of the results

これにより以下が確認できます:

  • ページ移動
  • テキスト入力
  • ボタンクリック(検索実行)
  • スクリーンショット撮影

4.3 デモ動画

以下の動画で実際のブラウザ操作の様子を確認できます:

チェックポイント

  • Browser Control画面を確認した
  • ブラウザ操作のテストを実行できた
  • スクリーンショットが生成された

注意事項

拡張機能のインストール先

Chrome拡張機能はAntigravity専用のブラウザプロファイルにインストールされます:

~/.gemini/antigravity-browser-profile

普段使いのChromeブラウザには影響しません。

Windows環境での注意

Windowsでは、ブラウザ操作時に普段使いのChromeが表示される場合があります。これは既知の問題ですが、タスク自体は正常に実行されます。

セキュリティ上の注意

リスク対策
悪意あるWebサイトへのアクセス信頼できるサイトのみアクセス
プロンプトインジェクション不審なサイトを避ける
機密データの漏洩本番環境・機密データでの使用は避ける

まとめ

お疲れ様でした!Chrome拡張機能のインストールとブラウザ統合の設定が完了しました。

このモジュールで学んだこと

  • Agent Managerの画面構成(Inbox, Workspaces, Playground)
  • Settings(設定)の各項目の意味
  • Chrome拡張機能のインストール方法
  • ブラウザ操作のテスト方法

次のステップ

次のモジュールでは、Agent Managerのマルチエージェント機能と並列実行について学びます。


参考資料


よくある質問

Q: 拡張機能がインストールできない場合は? A: Chrome以外のブラウザがデフォルトになっている場合、URLを手動でChromeにコピーしてインストールしてください。

Q: 「Setup」ボタンが表示されない場合は? A: Settings > Browser > 「Enable Browser Tools」がONになっているか確認してください。

Q: ブラウザ操作が失敗する場合は? A: Antigravityを再起動してから再試行してください。また、ファイアウォールがポート9222をブロックしていないか確認してください。

Q: 普段使いのChromeに影響はありますか? A: いいえ。Antigravityは専用のブラウザプロファイル(~/.gemini/antigravity-browser-profile)を使用するため、普段使いのChromeには影響しません。

運営: ゆめスタ