Midscene 让 UI 自动化告别选择器3 分钟跑通第一个 E2E 测试脚本【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midsceneMidscene 是一个基于多模态视觉的 GUI Agent 自动化测试框架你只需用自然语言描述点什么、查什么、断言什么它就能看懂界面截图并完成跨平台的 E2E 测试不用为每个按钮写维护选择器。它适合前端工程师、测试工程师和自动化爱好者最大的好处是——UI 改了脚本照样能跑。装好模型与插件先跑通第一个指令 这一节的目标很简单让你 5 分钟内亲手跑出一条自然语言指令感受 Midscene GUI Agent 自动化测试的基本盘。整个过程分三步。第 1 步准备一个会看界面的模型。Midscene 的 GUI Agent 依赖具备 UI 定位能力的多模态模型先把模型服务的四个环境变量配好export MIDSCENE_MODEL_BASE_URLhttps://你的模型服务地址/v1 export MIDSCENE_MODEL_API_KEY你的API Key export MIDSCENE_MODEL_NAME模型名称 export MIDSCENE_MODEL_FAMILY模型系列第 2 步装好运行载体。网页方向推荐装 Midscene Chrome Extension浏览器右侧会多出一个侧边栏不用搭任何项目环境。第 3 步输入第一条指令。打开任意网页在侧边栏里直接写中文比如点击登录按钮或页面顶部显示导航栏回车即可看到执行效果。跑通之后你就可以把同样的描述搬进代码或 YAML 脚本里正式进入自动化阶段。核心功能拆解从一句自然语言到一条测试流水线Midscene 把看、做、查、断四件事拆成了几个核心能力每个都只用一句话就能驱动。自然语言驱动 UI 交互它做什么aiAct接收一段自然语言目标自己观察界面、规划步骤、定位元素、逐步执行直到目标完成aiTap、aiInput这类即时交互 API 则负责点一下填一段的单一动作。怎么用在脚本或扩展侧边栏里直接写描述例如await agent.aiAct(搜索耳机将第一件商品加入购物车)。对你有什么好处定位只依赖截图不依赖 DOM 结构。重构页面、换掉组件库之后你的脚本通常一行都不用改连canvas、无语义的图标按钮这些传统手段摸不到的元素只要人眼看得见它就能点。一套 API 跑遍 Web 与移动端它做什么同一套 Agent API 覆盖 Web、Android、iOS、HarmonyOS 和桌面端任何能截屏的界面都是它的操作对象。怎么用初始化时换成对应平台的 Agent后面的aiAct、aiQuery等调用方式完全一致。对你有什么好处同一个下单流程今天测浏览器明天测手机 App代码几乎照抄。团队不需要为每个平台维护一套测试语言新人上手成本很低。结构化数据提取与界面断言它做什么aiQuery从界面里按你指定的结构提取数据aiAssert用一句话验证界面状态不满足时直接报错并说明原因。怎么用const items await agent.aiQuery( 购物车中的商品{name: string, price: number}[], ); await agent.aiAssert(页面顶部显示导航栏);对你有什么好处断言的对象是用户真实看到的样子——颜色、高亮、布局都算数而不只是某个 DOM 节点存在。爬虫式的页面取数也能用aiQuery一段完成省去逐层解析 HTML 的功夫。用 YAML 脚本把流程跑成流水线它做什么YAML 脚本运行器让你用一份配置文件描述打开哪个页面 按什么顺序做什么一条命令执行完并生成可视化报告。怎么用page: url: https://www.bing.com tasks: - name: 搜索天气 flow: - ai: 搜索 今日天气 - sleep: 3000 - aiAssert: 结果显示天气信息写好后执行midscene ./bing-search.yaml即可。对你有什么好处没有测试框架、没有环境配置流程维护者和开发都能读懂 YAML。简单回归、冒烟检查用不上重型工程几行就写完。这些场景里Midscene 能直接省掉你的活当你是一名前端工程师发版前想跑一轮关键路径回归时你可以把登录、下单、支付页渲染这些流程写成 YAML 脚本挂到 CI 里。过去选择器一断就得全员救火现在界面小改版通常不影响脚本你只把时间花在结果对不对上。当你是一名测试工程师同一个业务需要同时覆盖 Web 和 App 时你可以用同一套自然语言描述维护一份用例再通过不同平台的 Agent 分别执行。移动端那些 canvas 渲染、无文本标签的控件也不用再为它们单独找定位方案。进阶玩法常用指令速查与个性化配置熟练之后下面这几张表能帮你把日常操作压缩到最短路径。自然语言指令与 Agent API 对照表你想做的事自然语言示例对应 API多步骤自主操作搜索耳机并加入购物车aiAct单击元素右上角的购物车图标aiTap输入文本邮箱地址输入框aiInput检查界面状态购物车中有一件商品aiAssert提取结构化数据商品列表名称加价格aiQuery个性化配置方向难度旋钮aiAct支持deepThink加强任务拆解和deepLocate提升小元素定位精度复杂任务不稳时打开试试setAIActContext可以给 Agent 补充业务背景比如遇到 Cookie 弹窗先关掉。配置外置模型参数可以写进运行目录的.env文件命令行工具会自动加载换模型只改文件不改脚本。工具搭配浏览器自动化侧可以和 Playwright、Puppeteer 组合使用——浏览器导航、网络控制交给它们UI 操作交给 Midscene各干各的活。写在最后Midscene 把 UI 自动化的门槛从会写选择器降到了会说话Web 到桌面再到移动端一套自然语言打天下是目前做 GUI Agent 自动化测试最省心的选择之一。更多细节可以看仓库内文档快速开始、基本概念以及 YAML 脚本运行器。【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考