当前位置：首页 > news >正文

Midscene.js视觉自动化测试实战：一句话操控全平台UI

news 2026/8/14 13:16:33

Midscene.js视觉自动化测试实战：一句话操控全平台UI

【免费下载链接】midsceneAI-powered, vision-driven UI automation for every platform.项目地址: https://gitcode.com/GitHub_Trending/mid/midscene

周五下午五点，测试工程师小周收到一条消息：下周一发版，脚本里所有选择器要重查。他翻出那 300 行用例，一半是#login-btn、.submit-icon这种。周一 UI 重构上线，28 个用例挂了 26 个；他花两天逐条修，修完第三周，UI 又变了。这条"改不完的轮回"，每个做过 UI 自动化的团队都懂。

Midscene.js 就是冲着这个轮回来的——开源、纯视觉驱动的 UI 自动化测试引擎。它不看 DOM、不写选择器，只靠截图，用自然语言描述"做什么"，就能像人一样操作界面，跨平台覆盖 Web、Android、iOS、HarmonyOS 和桌面应用。

为什么"看得见"比"找得到"更可靠

传统自动化依赖页面结构：按钮得有 id，图标得有 aria-label。可现实里，图标按钮没有语义标记，<canvas>里的内容根本读不出来，跨域 iframe 和原生 App 更是够不着。最要命的是，你断言了"这个元素存在"，却永远验证不了"它看起来对不对"——颜色、高亮、布局错了，测试照样绿。

Midscene.js 换了个思路：界面长什么样，就按什么样处理。它只截一张图，交给多模态模型判断"搜索框在哪、该点什么"。人类能看到什么，它就能操作什么。重构改了样式？没关系，图变了你重说一遍就行。

零代码起步：装个扩展，当场跑通视觉自动化测试

最快的一条路是 Chrome 扩展。装好、点开面板、填好模型配置（服务商和 API Key），在任意网页上输入一句人话，比如"在搜索框输入 Midscene.js 并点击搜索"，回车就能看到它一步步定位、点击、回显结果。整个过程不用写一行代码，是体验"自然语言驱动 UI 自动化"最直观的一课。✨

三行代码接入你的测试流程

体验够了，就把自动化写进真实流程。用 CLI 一键建项目，配好模型环境变量后，核心逻辑其实只有三个方法：aiAction描述操作、aiQuery提取信息、aiAssert断言结果。

await agent.aiAction('在搜索框输入 Midscene.js 并回车') const title = await agent.aiQuery('页面标题是什么？') await agent.aiAssert('搜索结果里包含 Midscene 官网入口')

这段代码能跑在 Playwright、Puppeteer，或桥接模式连接的桌面浏览器上，也能直接放进 CI。它和你平时写的测试只有一个差别：里面没有一条选择器。

原理不神秘：截图当眼睛，模型当大脑

你可能会问：不读 DOM，它凭什么知道该点哪？打个比方，你接手一个陌生软件，不会先要它的源码，而是打开界面看一眼就懂了。Midscene.js 同理——截图就是眼睛，多模态模型就是大脑，定位元素靠的是"看"，不是"查"。

这一点还带来额外好处：模型是可替换的。Qwen、Doubao、GLM 等商用模型开箱即用，UI-TARS 这类开源模型还能自托管，数据不出内网。对测试环境敏感的公司，这是一条很实际的退路。

不止网页：跨平台UI自动化，手机和桌面同样一句话

同一套心智模型，换平台只是换"眼睛"的接法。接上 ADB 就是 Android 自动化，接上 WebDriverAgent 就是 iOS 自动化，桌面端能直接操控 Windows、macOS 和 Linux 应用。核心引擎在packages/core/，各平台实现相互独立，统一由一套 API 调度。

新手最容易踩的3个坑

模型没配对。报错十有八九是服务商、模型名或 API Key 不一致，先让单次调用跑通，再写完整脚本。
指令说得太含糊。"看一下页面"和"告诉我右上角按钮叫什么"执行效果天差地别，目标越具体，模型越稳。
设备端环境没就绪。手机自动化前，先确认 Android 开了 USB 调试、iOS 的 WebDriverAgent 正常启动，别让脚本替环境问题背锅。