资讯动态

Midscene.js 十五分钟上手:用自然语言写跨平台 UI 测试

发布时间:2026/9/11 22:49:04 来源:尧图企业网站定制
Midscene.js 十五分钟上手用自然语言写跨平台 UI 测试【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene接手一个频繁改版的项目那周选择器失效了一半用例跟着批量变红。Midscene.js 是一种 AI 视觉自动化思路它不维护选择器而是把界面截图交给视觉语言模型识别用自然语言驱动 Web、Android、iOS 等多端的 UI 操作。 项目定位用一套视觉模型驱动多端界面Midscene.js 是一个面向 E2E 测试的 GUI Agent相当于浏览器和设备之上的“视觉操作层”把当前截图交给视觉语言模型由模型识别元素、规划动作再把操作写回对应端。覆盖端WebChrome 扩展、Playwright / Puppeteer、Android、iOS、HarmonyOS 与桌面Windows / macOS / Linux同一套 Agent API 与 YAML 脚本结构通用于所有端接法与差异细节见 quick-start.mdx 能力拆解看屏幕找元素传统做法对着 DOM 写选择器页面一改版就失效canvas 和原生控件基本无能为力。Midscene.js 的做法是把截图发给模型让模型说出“右下角蓝色提交按钮”在哪里再按坐标执行点击与输入await agent.aiTap(右下角的蓝色提交按钮); await agent.aiAssert(页面应出现“操作成功”提示);用自然语言写操作脚本就是 YAML 文件flow里每一步是一句自然语言不用查 API 就能读懂要做什么。page: url: https://www.bing.com tasks: - name: Search for weather flow: - ai: Search for todays weather - aiAssert: Results show weather information字段全集agent配置、各端 target 声明等在 automate-with-scripts-in-yaml.mdx 有完整说明。一套脚本多端跑脚本顶部的目标声明决定跑在哪一端page指 Web 页面android通过 adb 连真机ios通过 WebDriverAgent 连设备flow部分保持同构。需要复用已登录的桌面浏览器时开桥接模式让本地脚本远程控制本机 Chromecookie 与登录态直接复用page: url: https://www.bing.com bridgeMode: newTabWithUrl⚙️ 上手从安装到跑通第一个脚本安装 CLI 与配置模型终端里的 Node.js 需要 20.19。装好 CLI 后在运行目录建.env填入模型服务的四项配置npm i -g midscene/cliMIDSCENE_MODEL_BASE_URLhttps://your-model-endpoint/v1 MIDSCENE_MODEL_API_KEYyour-api-key MIDSCENE_MODEL_NAMEyour-model-name MIDSCENE_MODEL_FAMILYyour-model-family可选模型清单与各家示例见 model-common-config.mdx。第一个 YAML 脚本把上文“用自然语言写操作”一节的search.yaml保存到项目里即可。文件只有三部分顶部 target 声明要操作的端、tasks声明用例、flow列出步骤sleep、runAdbShell等工具步骤可按需插入。CLI 运行与查看报告midscene ./search.yaml # 单脚本 midscene ./scripts/*.yaml # glob 批量执行过程实时打印进度结束后在midscene_run/report/下生成 HTML 报告逐步截图、模型定位框和可回放动画都在里面失败时直接看哪一步的定位偏了。跑不顺时先调这两项超时与重试命令行加--retry 2失败脚本会重跑批量执行配--continue-on-error一个用例挂了不拖累整批。模型选择元素识别质量由模型的视觉能力直接决定。定位频繁偏差时换更新、参数更大的视觉模型并核对MIDSCENE_MODEL_FAMILY是否配错。 两个代表性用例页面搜索测试Web典型的冒烟路径打开搜索页、输入关键词、断言结果出现。弹窗等干扰交给aiActContext兜底page: url: https://www.bing.com agent: aiActContext: 如果出现弹窗先关闭 tasks: - name: 搜索关键词 flow: - ai: 在搜索框输入“无线耳机”点击搜索 - sleep: 3000 - aiAssert: 结果页展示带价格的商品结果移动端登录回归Androidadb 连上真机后flow里不出现任何资源 ID改版只影响文案时脚本往往不用动android: deviceId: s4ey59 # adb devices 查看 tasks: - name: 登录回归 flow: - ai: 打开 App进入登录页 - ai: 在账号输入框填入测试账号 - ai: 输入密码点击登录按钮 - aiAssert: 登录后可见首页主界面电商价格监控、多端内容发布之类的场景同样只改顶部 target 声明。更多可直接运行的样例在 packages/cli/tests/midscene_scripts/。❓ 常见问题需要自己部署模型吗不必须。Midscene.js 把截图发给多模态模型服务做识别与规划配好MIDSCENE_MODEL_*四项环境变量即可开工想走本地服务时任何 OpenAI 兼容接口包括 Ollama 部署的视觉模型都可以接。点击位置偶尔会偏吗会定位精度取决于模型的视觉理解能力。常用手段有三个换更强的视觉模型描述元素时写外观特征加位置“右上角的人像头像图标”而不是“个人中心”对小而模糊的目标开启deepLocate做二次精定位。运行产物放在哪报告、日志、缓存在midscene_run/下HTML 报告在report/子目录。不想让它落在项目根目录用环境变量MIDSCENE_RUN_DIR指到别处即可。️ 文档与示例入口入门与 YAML 脚本quick-start.mdx、yaml-script-runner.mdx可运行脚本样例packages/cli/tests/midscene_scripts/社区与生态整理awesome-midscene.md工具选型看场景但对改版频繁的页面把选择器换成截图和自然语言回归脚本的维护成本会直观下降。【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价