用自然语言控制浏览器上手开源浏览器智能体 Magnitude 的完整路径【免费下载链接】browser-agentOpen-source, vision-first browser agent项目地址: https://gitcode.com/gh_mirrors/magnit/browser-agent如果你写过浏览器端到端测试多半被 CSS 选择器折磨过页面一改版测试就全挂。Magnitude 是一个开源的视觉优先vision-first浏览器智能体你用一句自然语言描述操作它自己看懂页面并完成点击、输入适合 Web 应用测试、跨应用自动化和数据抓取等场景。它为什么不用选择器传统框架靠选择器定位元素遇到复杂页面Shadow DOM、动态渲染就容易失效。Magnitude 的做法不同视觉模型直接读取页面画面给出像素级坐标来执行鼠标和键盘操作不依赖 DOM 结构。它提供四种基础能力Navigate识别任意界面并规划操作路径Interact执行精确的点击、拖拽、输入Extract按你给的数据结构提取结构化内容Verify内置测试运行器支持视觉断言最短上手路径先把仓库克隆到本地git clone https://gitcode.com/gh_mirrors/magnit/browser-agent接下来按场景二选一。场景一新建一个自动化项目npx create-magnitude-app这条命令会用模板生成一个新项目并一步步引导你配置模型。模板里自带一个示例脚本进入目录后执行npm start就能看到智能体打开浏览器、执行操作的完整过程用来验证环境是否配置成功。场景二给已有 Web 项目加测试npm i --save-dev magnitude-test npx magnitude init执行后会在tests/magnitude/下生成两个文件magnitude.config.ts测试配置和example.mag.ts示例测试用例。配置模型⚠️ Magnitude 必须搭配有视觉理解能力visually grounded的模型普通文本模型无法工作。最简单的配置方式是设置ANTHROPIC_API_KEY环境变量默认使用 Sonnet 4文档中也列出了 Qwen-2.5VL 72B 等兼容模型。模型选错是新手最常见的第一个卡点。创建第一个测试用例并运行先看最小配置片段import { type MagnitudeConfig } from magnitude-test; export default { url: http://localhost:8080 } satisfies MagnitudeConfig;url指向被测站点测试时所有用例默认从它出发。再看最小测试用例import { test } from magnitude-test; test(can add todos, { url: localhost:8080/todo }, async (agent) { await agent.act(create 3 todos, { data: Buy milk, Walk the dog, File the report }); await agent.check(should see all 3 todos); });写法就是把你要同事做的事讲清楚act是执行的操作check是期望的结果全部用自然语言。运行所有测试匹配*.mag.ts文件npx magnitude加-w 4可以并行跑 4 个 worker有测试失败时进程会以退出码 1 结束可以直接接进 CI 流水线。如何判断运行成功以及常见失败原因成功的表现浏览器窗口自动打开智能体按用例逐步操作终端同步打印每一步的动作和结果最后给出通过结论。测试失败的判定和 Playwright 不一样不是选择器匹配失败就算失败而是满足以下两种情况之一——某个act步骤无法完成或某个check断言不成立。常见卡点排查顺序模型没配好检查ANTHROPIC_API_KEY是否已设置模型是否具备视觉能力提示词太模糊act里说清目标对象和期望状态例如把任务 X 拖到 In Progress 列顶部而不是整理一下任务站点没启动本地站点用例需要先起服务url指向的地址必须可访问继续学习路径仓库内可以直接读的材料docs/目录完整文档覆盖快速开始、编写测试用例、运行测试、CI 集成等章节evals/basic/tests/仓库自带的示例测试套件包含滚动、Shadow DOM 等典型交互场景packages/magnitude-core/src/智能体核心源码想改默认行为或接入自己流程时从这里入手【免费下载链接】browser-agentOpen-source, vision-first browser agent项目地址: https://gitcode.com/gh_mirrors/magnit/browser-agent创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考