主角介绍：OpenCode & Agent Browser
简单理解：
OpenCode = 会写代码、会思考的“测试架构师”
Agent Browser = 会操作浏览器、会汇报结果的“自动化测试工程师”
项目由来：为什么是“AI + 浏览器”？
所以，这个组合的出现，不是偶然，而是“AI 生成测试”和“AI 操作浏览器”两个趋势的自然结合。
核心工作流程：AI 如何完成一次测试？
对 AI 来说，它并不关心底层的 DOM 结构，它只负责三件事：看快照、决定下一步、执行命令。
五、优点分析：这套组合强在哪？
六、横向对比：它和别家有什么不同？
工具/平台 | 定位与形态 | 核心优势 | 适用场景 |
|---|---|---|---|
OpenCode + Agent Browser | AI 编程助手 + 浏览器 CLI | AI 友好，上下文成本低，可深度集成到本地/CI 环境 | 需要 AI 生成和维护测试、对隐私和可控性要求高的团队 |
传统 Playwright/Puppeteer | 通用浏览器自动化库 | 功能强大，控制粒度细，生态成熟 | 需要精细控制和高稳定性的复杂自动化测试、爬虫 |
Agent 浏览器产品 (如 Browserbase) | 云端托管浏览器服务 | 无需自行维护基础设施，开箱即用 | 不想折腾环境，希望快速将浏览器能力集成到产品中的团队 |
AI 增强浏览器 (如 Dia) | 集成 AI 助手的浏览器 | 在日常浏览中提供 AI 辅助，体验平滑 | 个人用户上网、资料查询、内容创作辅助 |
简单来说，如果你想“用 AI 来生成和维护自动化测试”，而不是自己手写脚本，那么 OpenCode + Agent Browser 是一个非常值得尝试的组合。
七、实战小例子：百度搜索测试
npm install -g agent-browseragent-browser install
帮我写一个测试：打开百度，搜索“Agent Browser”，等待结果加载，然后截图保存为 result.png。用 agent-browser 的命令实现。
@echo offecho === Baidu Search Test: "Agent Browser" ===:: 1. 打开百度echo Opening Baidu...agent-browser open https://www.baidu.com:: 2. 获取页面快照，查看元素引用echo Getting page snapshot...agent-browser snapshot -i:: 3. 在搜索框中输入 "Agent Browser" (通常搜索框的 ref 是 @e1 或类似)echo Typing search query...agent-browser fill "#kw" "Agent Browser":: 4. 按下回车键或点击搜索按钮echo Pressing Enter to search...agent-browser press Enter:: 5. 等待页面加载echo Waiting for results to load...timeout /t 3 /nobreak >nul:: 6. 截图保存为 result.pngecho Taking screenshot...agent-browser screenshot result.png:: 7. 关闭浏览器echo Closing browser...agent-browser closeecho === Test completed! Screenshot saved as result.png ===
AI 提示词案例
5.1 基础提示词模板
模板 1：简单表单填写
请帮我自动化测试一个注册表单：
1. 打开 https://example.com/register
2. 填写用户名：testuser123
3. 填写邮箱：
4. 填写密码：Test123456
5. 点击注册按钮
6. 验证是否成功跳转到欢迎页面
模板 2：数据提取
请帮我从 https://example.com/products 页面提取所有商品信息：
1. 打开产品列表页面
2. 提取每个商品的名称、价格和描述
3. 将结果整理成表格格式
4. 截图保存页面
模板 3：登录流程测试
测试用户登录功能：
1. 打开 https://example.com/login
2. 输入用户名：demo_user
3. 输入密码：demo_pass
4. 点击登录按钮
5. 验证登录成功后是否显示"欢迎回来"
6. 检查用户头像是否可见
5.2 高级提示词案例
案例 1：完整的电商购买流程
帮我测试完整的购买流程：
1. 访问 https://shop.example.com
2. 搜索"笔记本电脑"
3. 选择价格范围 5000-8000 元的商品
4. 点击评分最高的商品
5. 查看商品详情和用户评价
6. 选择配置（内存：16GB，硬盘：512GB）
7. 点击立即购买
8. 填写收货地址：
- 姓名：张三
- 电话：13800138000
- 地址：北京市朝阳区xxx街道xxx号
9. 选择支付方式：支付宝
10. 验证订单信息正确
11. 截图保存订单确认页面
案例 2：社交媒体自动化测试
测试社交媒体发布功能：
1. 登录 https://social.example.com
- 用户名：test_social
- 密码：TestSocial123
2. 点击发布新动态按钮
3. 上传一张测试图片（使用本地路径：/path/to/test.jpg）
4. 输入文字内容："今天天气真不错！#美好生活"
5. 添加位置信息：北京·朝阳公园
6. 设置可见性：仅好友可见
7. 点击发布按钮
8. 验证动态是否成功发布
9. 检查图片是否正常显示
10. 验证标签是否正确显示
5.3 调试提示词
页面元素无法点击，请帮我分析：
1. 获取当前页面的完整快照
2. 检查目标元素是否被其他元素遮挡
3. 分析元素的可见性和可交互状态
4. 提供解决方案写在最后
我不再把自己当成“写测试脚本的人”，而是更多地去想：“这个页面的测试目标是什么？有哪些关键路径？” 具体怎么点、怎么等，就交给 AI 和 Agent Browser 去协作完成。
