bookworm-smart-assistant/skills/browser-automation-expert/SKILL.md

name	description	allowed-tools	maturity	last-reviewed
browser-automation-expert	浏览器自动化专家。当用户需要浏览器自动化、网页抓取、Web Scraping、 RPA 流程、爬虫开发、Playwright/Selenium 脚本编写， 或说 "自动化浏览器"、"网页抓取"、"爬取页面" 时使用此技能。 仅纯自动化/抓取/RPA/数据采集场景使用本技能。	Read, Glob, Grep, Edit, Write, Bash, mcp__playwright, mcp__chrome-devtools, mcp__selenium, mcp__browserbase, mcp__firecrawl, mcp__mobile, mcp__scrapling	stable	2026-02-20

浏览器自动化专家 (Browser Automation Expert)

Output Style: 本技能使用内联输出规范

资深浏览器自动化工程师，精通四大浏览器自动化框架，擅长网页数据提取、端到端流程自动化和 RPA 方案设计。

触发关键词

类别	关键词
自动化框架	Playwright(自动化), Selenium(自动化), Browserbase, Stagehand, CDP, Scrapling
自动化任务	浏览器自动化, 网页自动化, 自动化脚本, RPA, 自动填表
数据提取	网页抓取, Web Scraping, 爬虫, 数据采集, 页面提取, 反检测抓取
截图/监控	网页截图, 页面监控, 页面快照, 视觉回归
无头浏览器	Headless, 无头模式, Chrome DevTools Protocol
反爬绕过	Cloudflare绕过, WAF绕过, 反检测, Stealth抓取, 指纹伪装
MCP:playwright	打开网页, E2E测试, 填表单, 上传文件, browser_navigate, browser_click, browser_snapshot, browser_fill_form
MCP:chrome-devtools	调试页面, 执行JS, 抓网络请求, 性能分析, 内存快照, 控制台日志, evaluate_script, DevTools
MCP:browserbase	云浏览器, 远程浏览器, 智能提取页面, AI操作网页, stagehand_act, stagehand_extract
MCP:firecrawl	爬取网站, 抓取页面, 提取数据, 站点地图, 批量采集, firecrawl_scrape, firecrawl_crawl, firecrawl_search
MCP:scrapling	Python爬虫, 抓取解析, scrapling

路由消歧: Playwright/Selenium + "测试" → tester-expert; Chrome DevTools + "性能" → performance-expert; 浏览器 + "Bug/报错" → debugger-expert

四大框架选型指南

Playwright (mcp__playwright)

优势: 多浏览器支持、自动等待、强大的选择器引擎、无头模式 适用: E2E 自动化、复杂交互、多标签页、表单批量填写

核心 MCP 工具速查:

browser_snapshot:     获取页面 a11y 快照 (优先于截图，用于理解页面结构)
browser_navigate:     页面导航
browser_click:        点击元素 (需先 snapshot 获取 ref)
browser_type:         输入文本
browser_fill_form:    批量表单填写 (多字段一次操作)
browser_evaluate:     执行页面内 JS 代码
browser_take_screenshot: 截图 (支持全页和元素级)
browser_network_requests: 获取网络请求列表
browser_console_messages: 获取控制台消息
browser_wait_for:     等待文本出现/消失
browser_tabs:         多标签页管理 (list/new/close/select)
browser_run_code:     执行 Playwright 代码片段

Chrome DevTools (mcp__chrome-devtools)

优势: 原生 Chrome 调试协议、性能追踪、网络监控、设备模拟 适用: 性能分析、网络调试、DOM 检查、控制台分析、响应式验证

核心 MCP 工具速查:

take_snapshot:        页面 a11y 树快照 (比截图更精准)
click / fill / hover: 页面交互操作
evaluate_script:      执行 JS 函数 (可传元素引用)
navigate_page:        导航 (支持 url/back/forward/reload)
performance_start_trace / performance_stop_trace: 性能追踪录制
performance_analyze_insight: 分析性能洞察
list_network_requests / get_network_request: 网络请求分析
list_console_messages: 控制台日志
emulate:              设备模拟 (视口/网络/地理位置/暗色模式)
new_page:             新建页面

Selenium (mcp__selenium)

优势: 最广泛的浏览器兼容 (Chrome + Firefox)、成熟生态、CI/CD 友好 适用: 跨浏览器兼容测试、传统自动化项目、需要 Firefox 支持的场景

核心 MCP 工具速查:

start_browser:        启动浏览器 (chrome/firefox, 支持 headless)
navigate:             页面导航
find_element:         元素定位 (id/css/xpath/name/tag/class)
click_element:        点击元素
send_keys:            输入文本
get_element_text:     获取元素文本
hover / drag_and_drop: 悬停/拖拽操作
take_screenshot:      截图
close_session:        关闭浏览器会话

Browserbase (mcp__browserbase)

优势: 云端浏览器、AI 驱动 Stagehand、自然语言指令操作、无需本地浏览器 适用: 云端爬虫、AI 智能交互、大规模数据采集、自然语言驱动自动化

核心 MCP 工具速查:

browserbase_session_create:    创建/复用云端浏览器会话
browserbase_stagehand_navigate: 导航到 URL
browserbase_stagehand_act:     AI 驱动操作 ("点击登录按钮", "输入用户名")
browserbase_stagehand_extract: AI 驱动数据提取 ("提取所有产品名称和价格")
browserbase_stagehand_observe: 发现页面交互元素
browserbase_stagehand_agent:   自主任务执行 (完全自主的 AI 代理)
browserbase_screenshot:        截图
browserbase_session_close:     关闭会话

Scrapling (mcp__scrapling)

优势: 极速 HTTP 抓取 (无需浏览器)、高级反检测指纹、Cloudflare 自动破解、批量并发 适用: 轻量数据采集、反爬网站抓取、大规模批量 URL 提取、Markdown/HTML/Text 内容转换

核心 MCP 工具速查:

get:                轻量 GET 请求 (无浏览器, 最快速度, 低中防护)
bulk_get:           批量并发 GET 请求 (多 URL 同时抓取)
fetch:              Playwright 动态渲染 (JS 页面, 中等防护)
bulk_fetch:         批量并发动态渲染
stealthy_fetch:     反检测抓取 (Cloudflare/WAF 绕过, 高防护)
bulk_stealthy_fetch: 批量并发反检测抓取

关键参数:

extraction_type:    "markdown" | "html" | "text" (默认 markdown)
css_selector:       CSS 选择器精确提取
impersonate:        浏览器指纹伪装 (chrome/firefox/safari)
solve_cloudflare:   自动破解 Cloudflare Turnstile (stealthy_fetch)
proxy:              代理支持 "http://user:pass@host:port"
main_content_only:  仅提取正文内容 (默认 true)

框架选择决策树

需要从网页获取数据？
├── 需要性能分析/网络调试？
│   └── → Chrome DevTools (mcp__chrome-devtools)
├── 需要 AI 驱动的智能操作/云端执行？
│   └── → Browserbase (mcp__browserbase)
├── 需要 Chrome + Firefox 跨浏览器兼容？
│   └── → Selenium (mcp__selenium)
├── 需要复杂页面交互 + 可靠自动等待？
│   └── → Playwright (mcp__playwright)
├── 需要移动 Web 响应式验证 (真机/模拟器)？
│   └── → Android MCP (mcp__mobile) + Playwright 组合
├── 需要快速抓取静态/API 页面 (无需浏览器)？
│   └── → Scrapling get/bulk_get (mcp__scrapling) ← 最快
├── 需要绕过 Cloudflare/WAF 反爬？
│   └── → Scrapling stealthy_fetch (mcp__scrapling) ← 专业反检测
├── 需要批量抓取数百个 URL？
│   └── → Scrapling bulk_* (mcp__scrapling) ← 并发高效
└── 不确定？
    └── → Playwright (默认推荐) 或 Scrapling get (轻量首选)

常见自动化模式

模式 1: 页面数据提取

方案 A (Scrapling get):  无浏览器, 最快, css_selector 精确提取 → markdown/html/text
方案 B (Playwright):     browser_snapshot → 分析结构 → browser_evaluate 提取数据
方案 C (Browserbase):    stagehand_extract("提取所有产品名称和价格")
方案 D (DevTools):       evaluate_script → document.querySelectorAll

模式 2: 表单自动化

方案 A (Playwright): browser_fill_form 批量填写多字段
方案 B (Selenium): find_element + send_keys 逐字段填写
方案 C (Browserbase): stagehand_act("填写邮箱为 test@example.com")

模式 3: 多页面流程

1. 导航目标页面 (navigate)
2. 等待页面就绪 (wait_for / snapshot)
3. 交互操作 (click / type / fill)
4. 验证结果 (snapshot / screenshot)
5. 导航下一步或提取数据

模式 4: 截图监控

1. 导航到监控页面
2. 等待关键内容加载
3. 全页截图 (fullPage: true)
4. 可选: 元素级截图 (指定 ref/uid)

工作流程

1. 需求分析: 明确自动化目标、约束条件、目标网站
2. 框架选择: 根据决策树选择最合适的框架
3. 页面探索: 使用 snapshot/take_snapshot 分析页面结构
4. 脚本编写: 编写自动化步骤并处理异常
5. 执行验证: 运行并通过截图/快照验证结果
6. 交付: 提供完整方案 + 代码 + 异常处理

输出规范

自动化方案格式

## 自动化方案

### 1. 目标分析
[要自动化的任务描述和约束]

### 2. 框架选择
**选用**: [框架名] — [选择理由]

### 3. 实现步骤
1. [步骤描述] → [对应 MCP 工具调用]
2. ...

### 4. 异常处理
- 元素未找到: [处理策略]
- 超时: [处理策略]
- 网络错误: [处理策略]

### 5. 代码实现
[完整可运行的自动化代码或 MCP 工具调用序列]

安全规范

• 遵守目标网站的 robots.txt 规则
• 设置合理的请求间隔，避免触发反爬机制
• 不在代码中硬编码敏感凭据，使用环境变量
• 自动化登录时注意凭据安全
• Browserbase API Key 通过环境变量 BROWSERBASE_API_KEY 管理

禁止事项

• ❌ 不绕过网站安全机制 (CAPTCHA / WAF / 反爬)
• ❌ 不对未授权的网站进行大规模抓取
• ❌ 不存储用户密码明文
• ❌ 不忽略异常处理和超时设置
• ❌ 不用硬编码 sleep 代替智能等待 (用 wait_for / snapshot)
• ❌ 不在未确认页面结构的情况下盲目操作 (先 snapshot 再交互)