| name | agent-browser-skill |
| description | 基于 agent-browser CLI 的浏览器自动化工具。提供快照获取、元素交互、截图等功能。推荐用于需要页面快照分析、通过 ref 引用交互元素的场景。 |
Agent Browser 浏览器自动化
基于 Vercel agent-browser CLI 的浏览器自动化工具,专为 AI Agent 设计。
⚠️ 核心工作流:Snapshot + Ref
禁止猜测选择器!必须先获取 Snapshot,再通过 Ref 操作元素!
agent-browser open http://example.com
agent-browser snapshot -i
agent-browser click @e2
agent-browser fill @e3 "test@example.com"
agent-browser get text @e1
agent-browser snapshot -i
使用方法
通过 shell 直接调用 agent-browser 命令。所有命令都是独立的,会自动连接到后台守护进程管理的浏览器实例。
安装要求
npm install -g agent-browser
agent-browser install
核心命令
导航
agent-browser open <url>
agent-browser back
agent-browser forward
agent-browser reload
agent-browser close
快照(页面分析)
agent-browser snapshot
agent-browser snapshot -i
agent-browser snapshot -c
agent-browser snapshot -d 3
agent-browser snapshot -s "#main"
agent-browser snapshot --json
交互操作(使用 @ref)
agent-browser click @e1
agent-browser dblclick @e1
agent-browser focus @e1
agent-browser fill @e2 "text"
agent-browser type @e2 "text"
agent-browser press Enter
agent-browser press Control+a
agent-browser hover @e1
agent-browser check @e1
agent-browser uncheck @e1
agent-browser select @e1 "value"
agent-browser scroll down 500
agent-browser scrollintoview @e1
agent-browser drag @e1 @e2
agent-browser upload @e1 file.pdf
获取信息
agent-browser get text @e1
agent-browser get html @e1
agent-browser get value @e1
agent-browser get attr @e1 href
agent-browser get title
agent-browser get url
agent-browser get count ".item"
agent-browser get box @e1
状态检查
agent-browser is visible @e1
agent-browser is enabled @e1
agent-browser is checked @e1
截图 & PDF
agent-browser screenshot
agent-browser screenshot ./page.png
agent-browser screenshot --full
agent-browser pdf output.pdf
等待
agent-browser wait @e1
agent-browser wait 2000
agent-browser wait --text "成功"
agent-browser wait --url "**/dashboard"
agent-browser wait --load networkidle
CSS 选择器(也支持)
agent-browser click "#submit"
agent-browser fill "#email" "test@example.com"
agent-browser find role button click --name "Submit"
会话管理
多个 AI Agent 可使用不同的浏览器实例:
agent-browser --session agent1 open site-a.com
agent-browser --session agent2 open site-b.com
AGENT_BROWSER_SESSION=agent1 agent-browser click @e1
agent-browser session list
截图路径约定
建议统一保存到 SCREENSHOT_DIR 环境变量指定的目录:
SCREENSHOT_DIR=$(pwd)/media/screenshots
agent-browser screenshot ${SCREENSHOT_DIR}/case_11_step1.png
典型使用场景
登录测试
agent-browser open http://192.168.150.114:8913/login
agent-browser snapshot -i
agent-browser fill @e1 "admin"
agent-browser fill @e2 "admin123456"
agent-browser screenshot ./step1_filled.png
agent-browser click @e3
agent-browser wait --url "**/dashboard"
agent-browser snapshot -i
agent-browser screenshot ./step2_result.png
agent-browser close
与 playwright-skill 对比
| 特性 | agent-browser-skill | playwright-skill |
|---|
| 调用方式 | 独立 CLI 命令 | node run.js "code" |
| 元素定位 | Snapshot + @ref | CSS 选择器 |
| 状态保持 | 自动守护进程 | 每次启动新浏览器 |
| AI 友好度 | 高(专为 AI 设计) | 中 |
| 代码复杂度 | 简单命令 | 需写 JS 代码 |