Playwright MCP：比 agent-browser 更可控的浏览器自动化

适合谁

• 已经用过 Playwright 或 Cypress 做端到端测试的开发者
• 需要自动化网页操作但对结果确定性要求高的场景（比如自动填表、定期截图对比）
• 需要浏览器自动化脚本并希望 AI 来辅助生成和调试的人
• QA 工程师希望用自然语言生成并优化测试脚本

不适合谁

• 不了解什么是 CSS selector、XPath、waitForSelector 的人
• 只想偶尔让 AI 帮忙浏览网页的普通用户（agent-browser 已够用）
• 期望零配置直接运行复杂操作的人
• 需要在 Windows 上稳定运行（macOS/Linux 支持更好）

3 分钟上手

安装

npx clawhub@latest install playwright

前置要求

确保本地已安装 Playwright 浏览器：

npx playwright install chromium

第一次正确使用

1. "用 Playwright 打开 https://example.com 并截图" — 确认浏览器能启动
2. "找到页面上的 h1 元素，返回它的文本内容" — 测试 selector 功能
3. 然后再尝试模拟点击等交互操作

典型使用场景

场景 1：自动化测试脚本生成

描述你的测试用例："用户点击登录按钮，输入正确的用户名密码，应该跳转到 dashboard" — AI 生成完整的 Playwright 测试脚本，你 review 后加入测试套件。

场景 2：定期页面监控截图

定期对某个页面截图，与上次截图做视觉对比，检测页面是否发生了预期外的变化（适合监控竞品或关键生产页面）。

场景 3：复杂多步骤 Web 爬取

需要登录 → 导航 → 等待动态加载 → 提取特定数据，整个流程比简单 HTTP 请求复杂——Playwright 能处理这类场景，但你需要能调试它的输出。

常见翻车点

• selector 失效：网页改版后 selector 失效，AI 给的 selector 在你的环境里可能也不对
• 等待时机问题：AI 生成的脚本没有正确等待动态元素，导致操作了还没加载的元素
• 浏览器版本不匹配：生成的脚本假设了特定浏览器行为，在不同版本下表现不同
• 把生成的脚本直接放入 CI：AI 生成的代码需要人工 review，尤其是涉及真实用户数据的测试

风险提示

权限风险

• 浏览器控制：可打开任意 URL，执行 JavaScript，截图，操作 DOM
• 高权限：和 agent-browser 同级别，可访问你已登录的所有网站 session

使用风险

• 调试成本高：自动化脚本出问题时排查原因比手动操作复杂得多
• 敏感 session 风险：如果浏览器已登录敏感账号，AI 操作有误操作风险

建议

• 使用专用的隔离浏览器 profile，不要用你日常使用的浏览器 session
• AI 生成的脚本在本地测试环境跑通后再考虑自动化部署
• 对任何会写入数据或提交表单的操作，第一次必须在旁边监督完整执行

相关替代技能

• Agent Browser：更易用、更适合一次性任务，不需要写脚本
• Bash：如果自动化需求可以用 curl + shell 脚本解决，不需要真实浏览器