本文へ移動
cccskills
無料GitHub で公開

agent-browser

ブラウザを手足のように操る。ページ遷移、フォーム入力、スクショ、なんでもこい。

Use when users ask to navigate websites, fill forms, take screenshots, extract web data, test web apps, or automate browser workflows. Trigger phrases include 'go to [url]', 'click on', 'fill out the form', 'take a screenshot', 'scrape', 'automate', 'test the website', 'log into', or any browser interaction request. Do NOT load for: sharing URLs, embedding links, screenshot image files.

インストール方法を見る

含まれるファイル(2)

  • SKILL.md6.3 KB
  • metadata.json892 B

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

Agent Browser Skill

ブラウザ自動化を行うスキル。agent-browser CLI を使用して、UI デバッグ・検証・自動操作を実行します。


トリガーフレーズ

このスキルは以下のフレーズで自動起動します:

  • 「ページを開いて」「URLを確認して」
  • 「クリックして」「入力して」「フォームに」
  • 「スクリーンショットを撮って」
  • 「UIを確認して」「画面をテストして」
  • "open this page", "click on", "fill the form", "screenshot"

機能詳細

機能詳細
ブラウザ自動化See references/browser-automation.md
AI スナップショットワークフローSee references/ai-snapshot-workflow.md

実行手順

Step 0: agent-browser の確認

# インストール確認
which agent-browser

# 未インストールの場合
npm install -g agent-browser
agent-browser install

Step 1: ユーザーのリクエストを分類

リクエストタイプ対応アクション
URL を開くagent-browser open <url>
要素をクリックスナップショット → agent-browser click @ref
フォーム入力スナップショット → agent-browser fill @ref "text"
状態確認agent-browser snapshot -i -c
スクリーンショットagent-browser screenshot <path>
デバッグagent-browser --headed open <url>

Step 2: AI スナップショットワークフロー(推奨)

ほとんどの操作で、まずスナップショットを取得してから要素参照で操作します:

# 1. ページを開く
agent-browser open https://example.com

# 2. スナップショット取得(AI 向け、インタラクティブ要素のみ)
agent-browser snapshot -i -c

# 出力例:
# - link "Home" [ref=e1]
# - button "Login" [ref=e2]
# - input "Email" [ref=e3]
# - input "Password" [ref=e4]
# - button "Submit" [ref=e5]

# 3. 要素参照で操作
agent-browser click @e2           # Login ボタンをクリック
agent-browser fill @e3 "user@example.com"
agent-browser fill @e4 "password123"
agent-browser click @e5           # Submit

Step 3: 結果の確認

# 現在の状態をスナップショットで確認
agent-browser snapshot -i -c

# または URL を確認
agent-browser get url

# スクリーンショットを取得
agent-browser screenshot result.png

クイックリファレンス

基本操作

コマンド説明
open <url>URL を開く
snapshot -i -cAI 向けスナップショット
click @e1要素をクリック
fill @e1 "text"フォームに入力
type @e1 "text"テキストを入力
press Enterキーを押す
screenshot [path]スクリーンショット
closeブラウザを閉じる

ナビゲーション

コマンド説明
back戻る
forward進む
reloadリロード

情報取得

コマンド説明
get text @e1テキスト取得
get html @e1HTML 取得
get url現在の URL
get titleページタイトル

待機

コマンド説明
wait @e1要素を待機
wait 10001秒待機

デバッグ

コマンド説明
--headedブラウザを表示
consoleコンソールログ
errorsページエラー
highlight @e1要素をハイライト

セッション管理

複数のタブ/セッションを並列管理:

# セッションを指定
agent-browser --session admin open https://admin.example.com
agent-browser --session user open https://example.com

# セッション一覧
agent-browser session list

# 特定セッションで操作
agent-browser --session admin snapshot -i -c

MCP ブラウザツールとの使い分け

ツール推奨度用途
agent-browser★★★第一選択。AI 向けスナップショットが強力
chrome-devtools MCP★★☆Chrome が既に開いている場合
playwright MCP★★☆複雑な E2E テスト

原則: まず agent-browser を試し、うまくいかない場合のみ MCP ツールを使用。


注意事項

  • agent-browser はヘッドレスモードがデフォルト
  • --headed オプションでブラウザを表示可能
  • セッションは明示的に close するまで維持される
  • 認証が必要なサイトはセッションを活用

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

Use when you need to install the embedded robot agents into either .cursor/agents or .claude/agents, selecting the destination interactively and copying the embedded agent definitions from project assets. This should trigger for requests such as Install embedded agents; Bootstrap .cursor/agents; Bootstrap .claude/agents; Copy robot agents. Part of cursor-rules-java project

日本語の概要は準備中です。原文の説明を表示しています。

majiayu000/claude-skill-registry-data262026年10月11日 更新

Use when you need to generate an AGENTS.md file for a Java repository — covering project conventions, tech stack, file structure, commands, Git workflow, and contributor boundaries — through a modular, step-based interactive process that adapts to your specific project needs. This should trigger for requests such as Create AGENTS.md; Update AGENTS.md file; Add agent instructions. Part of cursor-rules-java project

日本語の概要は準備中です。原文の説明を表示しています。

majiayu000/claude-skill-registry-data262026年10月11日 更新

Expert legal research agent for finding and scraping expungement data state by state. Knows authoritative sources, URL patterns, Firecrawl configuration, and 2026 legal landscape. Activate on "find expungement data", "scrape state laws", "legal research", "court URLs", "statute sources", "Clean Slate laws", "automatic expungement research". NOT for interpreting laws (use national-expungement-expert), building UI, or legal advice.

日本語の概要は準備中です。原文の説明を表示しています。

majiayu000/claude-skill-registry-data262026年10月11日 更新

Generated by Gremlin Forge Meta-Agent 🍆👾⚡

日本語の概要は準備中です。原文の説明を表示しています。

majiayu000/claude-skill-registry-data262026年10月11日 更新

Work autonomously without waiting for hand-holding — complete tasks end-to-end without asking for permission at every step.

日本語の概要は準備中です。原文の説明を表示しています。

majiayu000/claude-skill-registry-data262026年10月11日 更新

abmahnung

無料

Entwurf einer BAG-konformen Abmahnung im Arbeitsrecht – konkrete Schilderung der Pflichtverletzung, klare Verhaltenserwartung, ausdrückliche Sanktionsandrohung. Use when AG eine verhaltensbedingte Sanktion vor einer Kündigung dokumentieren muss oder AN die Wirksamkeit einer empfangenen Abmahnung prüft.

日本語の概要は準備中です。原文の説明を表示しています。

majiayu000/claude-skill-registry-data262026年10月11日 更新

majiayu000 のスキルをすべて見る

このスキルの問題を報告する