Midscene.js3 分钟学会 AI 浏览器自动化【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene周五发布前的下午你要逐个点开六个后台页面确认灰度状态再手动抄一遍订单字段贴进表格。Midscene 是一个 AI 浏览器自动化框架它靠截图看懂页面再按你的自然语言去点。 Midscene 是什么AI 浏览器自动化速写Midscene 是一个面向 E2E 测试的 GUI Agent你用自然语言描述步骤由多模态模型规划并操作界面。它替代的是过去写选择器、维护脚本、读 DOM 校验那套流程元素定位只依赖截图不依赖 DOM 结构所以重构、图标按钮、canvas 这类情况它都能处理。⚖️ 前后对比写脚本 vs 写句子手写脚本时用 Midscene 时每个元素写 selector重构即失效用一句自然语言定位人能看到就能点读 DOM 校验节点是否存在看截图校验颜色、布局、渲染结果弹窗、canvas、跨域 iframe 难处理截图里可见的元素都能触达失败只有报错难复盘每次运行产出可回放的可视化报告 两个场景走一遍数据提取与登录态验证取数是最常被拿来试的场景。你在侧边栏的 Query 里输入提取页面上的商品{name: string, price: number}[]它截图当前页面按你给的 JSON 结构把名称和价格抓出来返回一个可以直接进表格或脚本的数组省去了先写选择器这一步。第二个场景是登录态验证。你在 Assert 里输入确认页面右上角显示了已登录的用户名它判断条件成立就通过不成立就抛出错误并在错误里写明模型给出的原因。把这句话放进 CI就能在每次发布后自动挡住看着像成功、其实掉登录的情况而不需要你每次都手点一遍。 桥接模式本地脚本接管桌面 Chrome桥接模式是它区别于普通录屏脚本的一点你本地终端跑的 Node.js 脚本能直接接管你正在用的桌面 Chrome复用它的 cookie、插件和登录态。脚本和人工操作因此可以在同一个浏览器里交替进行也就是常说的人在回路。做内部系统、要带真实登录态跑 E2E、或需要人工补一步再让脚本继续的团队会用到这个能力。最小示例import { AgentOverChromeBridge } from midscene/web/bridge-mode; const agent new AgentOverChromeBridge(); await agent.connectCurrentTab(); await agent.aiAct(搜索无线耳机按价格排序);边界与限制它不是银弹说实话Midscene 不是替代 DOM 自动化的银弹而是补在它够不着的地方。它每一步都要把截图喂给多模态模型所以比纯选择器方案更吃 token、也更慢跑大批量用例时模型费用和耗时绕不开它依赖你配的模型模型定位不准动作就会跟着偏。有个坑要注意需要强确定性流程时纯 AI 规划的 aiAct 反而不如你自己用 JS 编排可控因为后者执行路径是明确的。下一步想跑通第一条指令从 快速开始 配好模型即可再看 基本概念 里 aiAct、aiQuery、aiAssert 各自的职责。想接脚本做人在回路直接读 桥接模式。社区入口在官方 Discord 与飞书交流群中英文文档都在官网 midscenejs.com 上。【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考