Menu
agent-browser CLIを使ったブラウザ操作のガイド。Webページの操作、スクレイピング、スクリーンショット取得などブラウザ自動化が必要なときに参照する。「ブラウザで開いて」「Webページを操作して」「スクリーンショットを撮って」と言われたらこのスキルを使う。
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
セッション履歴を根拠およびサマリとして使用し、現在の変更からきちんとした git コミットを作成する。コミット作成、コミットメッセージの準備、または staged な作業のファイナライズを依頼されたときに使用する。
PR をランディングする。コンフリクトを監視・解決し、チェックを待ち、グリーンに なったら squash-merge する。land、merge、PR を完了まで導くことを依頼された ときに使用する。
Linear と対話するためのスキル。Linear MCP サーバー（`mcp__linear__*` ツール）を 優先的に使用し、MCP でカバーされない生の GraphQL 操作（イントロスペクション、 ファイルアップロードなど）は `linear_graphql` クライアントツールにフォールバックする。
最新の origin/main を現在のローカルブランチに pull し、マージコンフリクトを 解決する（別名 update-branch）。Codex が feature ブランチを origin と同期し、 rebase ではなく merge ベースの更新を行い、コンフリクト解決のベストプラクティス に従う必要があるときに使用する。
現在のブランチの変更を origin に push し、対応する pull request を作成 または更新する。push、更新の公開、pull request の作成を依頼されたときに使用する。
コードレビュー・テストガイドラインチェック・コード品質チェックを同時実行する
| name | agent-browser |
| description | agent-browser CLIを使ったブラウザ操作のガイド。Webページの操作、スクレイピング、スクリーンショット取得などブラウザ自動化が必要なときに参照する。「ブラウザで開いて」「Webページを操作して」「スクリーンショットを撮って」と言われたらこのスキルを使う。 |
agent-browser はAIエージェント向けの高速ブラウザ自動化CLIツール。Bashツールから直接呼び出して使う。
# ページを開く
agent-browser open "https://example.com"
# アクセシビリティツリーを取得（AI向け。@ref付きで要素を特定できる）
agent-browser snapshot -i # -i: インタラクティブ要素のみ
# @ref を使って要素を操作
agent-browser click @e2
agent-browser fill @e3 "入力テキスト"
# 操作後に再度スナップショットで状態確認
agent-browser snapshot -i
重要: 操作のたびに snapshot -i で現在の状態を確認すること。 ページの状態は操作ごとに変わるため、古い@refは無効になる可能性がある。
agent-browser snapshot # フルツリー
agent-browser snapshot -i # インタラクティブ要素のみ（推奨）
agent-browser snapshot -c # コンパクト（空の構造要素を除去）
agent-browser snapshot -d 3 # 深さ制限
agent-browser snapshot -s "#main" # CSSセレクタでスコープ限定
agent-browser open <url> # URLに移動
agent-browser back # 戻る
agent-browser forward # 進む
agent-browser reload # リロード
agent-browser click <sel> # クリック（@ref またはCSSセレクタ）
agent-browser dblclick <sel> # ダブルクリック
agent-browser type <sel> <text> # テキスト入力（既存テキストに追加）
agent-browser fill <sel> <text> # クリア後に入力（フォーム向け）
agent-browser press <key> # キー押下（Enter, Tab, Control+a など）
agent-browser hover <sel> # ホバー
agent-browser check <sel> # チェックボックスON
agent-browser uncheck <sel> # チェックボックスOFF
agent-browser select <sel> <val> # ドロップダウン選択
agent-browser get text <sel> # テキスト取得
agent-browser get html <sel> # HTML取得
agent-browser get value <sel> # input値取得
agent-browser get attr <name> <sel> # 属性取得
agent-browser get title # ページタイトル
agent-browser get url # 現在のURL
agent-browser get count <sel> # 要素数
agent-browser get box <sel> # 要素の位置・サイズ
agent-browser is visible <sel> # 表示されているか
agent-browser is enabled <sel> # 有効か
agent-browser is checked <sel> # チェックされているか
セマンティックなロケーターで要素を探してアクションを実行：
agent-browser find role button click --name "送信"
agent-browser find text "ログイン" click
agent-browser find label "メールアドレス" fill "test@example.com"
agent-browser find placeholder "検索..." fill "キーワード"
agent-browser find testid "submit-btn" click
agent-browser screenshot # 画面キャプチャ（デフォルトパス）
agent-browser screenshot ./shot.png # パス指定
agent-browser screenshot --full # フルページ
agent-browser pdf ./page.pdf # PDF保存
スクリーンショットを撮った後は Read ツールでファイルを読み取って画像を確認できる。
agent-browser scroll down # 下にスクロール
agent-browser scroll up # 上にスクロール
agent-browser scroll down 500 # 500pxスクロール
agent-browser scrollintoview <sel> # 要素が見えるまでスクロール
agent-browser wait <sel> # 要素が表示されるまで待機
agent-browser wait 2000 # 2秒待機
agent-browser eval "document.title"
agent-browser eval "document.querySelectorAll('a').length"
agent-browser tab list # タブ一覧
agent-browser tab new # 新しいタブ
agent-browser tab 2 # 2番目のタブに切替
agent-browser tab close # 現在のタブを閉じる
agent-browser network requests # リクエスト一覧
agent-browser network requests --filter "api" # フィルタ
agent-browser network route "*/api/*" --abort # リクエストブロック
agent-browser network unroute # ルート解除
agent-browser console # コンソールログ表示
agent-browser errors # エラー表示
agent-browser highlight <sel> # 要素ハイライト
agent-browser trace start # トレース開始
agent-browser trace stop # トレース停止
agent-browser set viewport 1280 720 # ビューポート設定
agent-browser set device "iPhone 15" # デバイスエミュレーション
agent-browser set media dark # ダークモード
agent-browser set offline on # オフラインモード
agent-browser set headers '{"Authorization":"Bearer xxx"}' # ヘッダー設定
agent-browser --session mywork open "https://example.com" # 名前付きセッション
agent-browser session list # セッション一覧
セッションを指定すると、同じブラウザコンテキスト（Cookie等）を維持できる。
agent-browser open "https://example.com"
agent-browser snapshot -c # コンパクトなツリーで内容確認
agent-browser open "https://example.com/form"
agent-browser snapshot -i
# スナップショットの@refを使って操作
agent-browser fill @e1 "名前"
agent-browser fill @e2 "email@example.com"
agent-browser click @e3 # 送信ボタン
agent-browser wait 2000
agent-browser snapshot -i # 結果確認
agent-browser --session auth open "https://example.com/login"
agent-browser --session auth snapshot -i
agent-browser --session auth fill @e1 "username"
agent-browser --session auth fill @e2 "password"
agent-browser --session auth click @e3
# 以降も同じセッションを使い続ける
agent-browser --session auth open "https://example.com/dashboard"
agent-browser open "https://example.com"
agent-browser screenshot ./tmp_screenshot.png
# Readツールで画像を確認
| オプション | 説明 |
|---|---|
--session <name> | セッション名（Cookie等を維持） |
--headed | ブラウザウィンドウを表示（デバッグ用） |
--json | JSON形式で出力 |
--full, -f | フルページスクリーンショット |
--cdp <port> | Chrome DevTools Protocolで接続 |
--headers <json> | HTTPヘッダーを設定 |
--debug | デバッグ出力 |
@ref（スナップショットから取得）が最も確実。CSSセレクタも使える--headed で画面表示agent-browser install を先に実行