Midscene.js用一张截图完整跑通 AI UI 自动化【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midsceneMidscene.js 是一个 AI UI 自动化 SDK截个图、给一句自然语言指令它就能替你操作界面。Web、Android、iOS、桌面共用同一套 API不再需要追着改会失效的选择器。适合需要写跨平台 UI 测试的测试工程师和开发者。第一次见到它只说了一句帮我找这个项目 同事给我演示 Midscene 时没有写任何代码。装上 Chrome 扩展后页面右侧多出一个侧边栏我直接输入一句在 GitHub 上搜索 Midscene.js 项目。几秒后浏览器自己把关键词填进搜索框、回车结果页就停在了目标项目上。接着我又问第一个项目有多少 star它返回了一个结构化的数字。全程没有打开开发者工具查 DOM也没有写一行选择器——你只需要会说人话。这类浏览器内的 Playground 就是它的上手入口先在网页里感受自然语言控制浏览器的感觉确认指令可用后再原封不动搬进代码里跑。它凭什么不一样选择器 vs 视觉识别维度传统选择器方案Midscene 视觉方案界面重构选择器失效要重查重写画面没变指令就不变canvas、纯图标按钮结构里看不见定位不到人眼看得见就能点断言方式判断节点是否存在校验看到的样子颜色、布局跨平台每个平台一套技术栈同一套 API 覆盖多端5 分钟跑通第一次自动化 ⏱️npm i midscene/web playwright tsx新建demo.tsimport { chromium } from playwright; import { PlaywrightAgent } from midscene/web/playwright; const browser await chromium.launch({ headless: false }); const page await browser.newPage(); await page.goto(https://github.com); const agent new PlaywrightAgent(page); await agent.aiAct(在顶部搜索框搜索 Midscene.js 项目); const results await agent.aiQuery( {name: string, stars: string}[], 取搜索结果前三项, ); console.log(results); await browser.close();然后执行npx tsx demo.ts跑完后本地会生成midscene_run/report/目录里面是一份 HTML 报告每一步做了什么、当时屏幕长什么样、模型怎么规划的都可以逐步回放。测试失败时这份报告就是排查入口。它是如何看屏幕的 整条链路可以拆成四步先对当前界面截图把截图连同你的自然语言指令一起发给多模态模型模型返回目标在屏幕的哪个坐标、需要分几步做SDK 把坐标换算成真实的点击、输入执行完再截一张图确认结果是否符合预期。全程不读一行 DOM也不依赖 XPath。打个比方这像一个只能看屏幕、摸不到代码库的新员工——他不知道按钮的 class 叫什么但看见加入购物车就点过去了。视觉模型引擎负责模型调用与步骤规划Web 集成层负责把指令落到 Playwright 或 Puppeteer 上执行。能力扩展一套 API 覆盖多端 跨平台aiAct、aiQuery同一套接口覆盖 Web、Android、iOS、HarmonyOS 和桌面端。模型选择Qwen3.x、GLM-4.6V、gemini-3.5-flash 等可直接配置UI-TARS 等开源模型可自托管。缓存加速开启缓存后官方示例的执行耗时从 51 秒降到 28 秒第二次跑肉眼可见地快。自然语言等待aiWaitFor可以等页面上出现至少一件商品这类状态替代硬编码的 sleep。YAML 脚本不写 JS 也能用 YAML 描述流程CLI 包支持批量跑脚本。真实用法三个开箱即用的场景 电商回归测试把把第一件商品加入购物车并确认数量变为 1写成一条aiAct跑完用aiAssert校验小计金额。前端重构后只要用户看到的画面没变用例一行都不用改。移动端验证设备连上后同一条aiAct(打开设置找到版本号)就能在真机上执行报告里直接看到每一步的手机画面。数据抓取对任意列表页用aiQuery描述想要的结构比如{name: string, price: number}[]直接拿到结构化 JSON不用手写解析逻辑。上手前避坑 ❓稳定吗官方 AndroidWorld 基准 Pass1 为 93.1%且每步执行后都会用视觉复核结果。能离线跑吗自托管 UI-TARS 等开源模型后全流程不需要外网。支持哪些语言官方 SDK 是 JavaScript/TypeScript 加 YAML社区另有 Python、Java 封装。速度快吗单步耗时秒级主要取决于模型响应速度和任务复杂度。数据会发出去吗默认只把截图发给模型DOM 信息不开启就不上传。Midscene.js 把 UI 自动化的判断依据从代码结构换成了人眼所见维护成本随之降到与界面变化速度挂钩。下一步把仓库 clone 到本地https://gitcode.com/GitHub_Trending/mid/midscene打开packages/web-integration/demo/里的示例跑一遍或给自己的后台页面写第一条aiAct。【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考