10 分钟跑通 Midscene.js：AI 驱动的 GUI 自动化测试

10 分钟跑通 Midscene.jsAI 驱动的 GUI 自动化测试【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midsceneMidscene.js 是一个视觉驱动的 GUI 自动化框架你用自然语言描述要做什么它截图、定位元素、执行点击和输入再自动验证结果。同一套 Agent API 覆盖 Web、Android、iOS、HarmonyOS 和桌面端。它解决的是传统自动化的痛点选择器一改版就碎canvas、iframe、原生控件根本够不着每个平台还得维护一套脚本。它能帮你干什么 ️在 Playground 里零代码试指令。装好 Chrome 扩展在浏览器侧边栏直接输入点击登录按钮提取页面里的商品列表实时看到执行效果是体验 Midscene.js GUI 自动化最快的方式。驱动 Android 真机。adb 连上真机或模拟器后同样的自然语言指令就能操作 App打开设置查系统版本、在电商 App 里下单。嵌进现有测试项目。aiAct、aiQuery、aiAssert可以和 Playwright、Puppeteer 代码混用在现有测试框架里复用它的视觉能力。生成可追溯的报告。每次运行自动产出 HTML 报告包含截图、AI 决策过程和每步结果排查失败不用猜。跑起来第一个 Midscene 脚本最小路径就三步装 CLI、配模型、写脚本。安装 CLI要求 Node.js 20.19 / 22.12 / 24npm i -g midscene/cli在运行目录建.env配模型以豆包为例换模型只改这几行MIDSCENE_MODEL_BASE_URL你的模型服务地址/v1 MIDSCENE_MODEL_API_KEY你的APIKey MIDSCENE_MODEL_NAME你的模型名称 MIDSCENE_MODEL_FAMILY你的模型系列写一个bing-search.yaml一条命令跑起来page: url: https://www.bing.com tasks: - name: 搜索天气 flow: - ai: 搜索 今日天气 - sleep: 3000 - aiAssert: 结果显示天气信息midscene ./bing-search.yaml看到什么算成功终端逐步输出执行进度跑完生成 HTML 报告文件打开后能看到每步的页面截图和断言结果。核心能力aiAct、aiQuery、aiAssertaiAct一句话完成多步流程搜索耳机并筛选 100 美元以下这种指令人话是三步代码就一行import { PlaywrightAgent } from midscene/web/playwright; const agent new PlaywrightAgent(page); await agent.aiAct(搜索耳机并筛选 100 美元以下的结果);原理是每轮截图让多模态模型规划下一步点哪、输什么执行后再截图直到目标达成。不依赖选择器纯图标按钮、canvas、跨域 iframe 都能操作。aiQuery从屏幕上拿结构化数据抓电商列表的商品名和价格把数据形状定义清楚直接返回数组const products await agent.aiQuery( 页面中的商品{name: string, price: number}[], );aiAssert验证用户看到的东西选中的套餐有蓝色边框和对勾这类视觉状态DOM 断言写不出来。Midscene.js 的视觉断言就是让模型像人一样看截图判断适合跨平台 E2E 校验。用起来之后四个高频问题排查现象CLI 运行脚本报 Unsupported Node.js version原因Node.js 版本低于 20.19CLI 依赖的 Rspack 工具链会拒绝较旧的 patch 版本。 处理升级到 Node.js 20.19 / 22.12 / 24重新安装 CLI。现象Chrome 扩展报 Cannot access a chrome-extension:// URL of different extension原因其他扩展往页面注入了iframe或script与 Midscene 冲突。 处理在开发者工具里找到chrome-extension://开头的资源 URL到扩展列表禁用对应扩展刷新页面重试。现象用 Ollama 模型时 403原因Chrome 扩展跨域访问被 Ollama 默认拦截。 处理设置环境变量OLLAMA_ORIGINS*。现象.env里的模型配置不生效原因.env必须放在工具运行目录和 YAML 位置无关且默认不覆盖已有的同名全局环境变量。 处理确认文件位置需要覆盖时用--dotenv-override参数。模型支持范围与完整配置项见 模型配置 和 支持的模型与配置。下一步建议先按 快速开始 在 Playground 里跑通第一条指令指令写熟后参照 YAML 脚本运行器 把它们变成可在 CI 里执行的测试脚本。【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考