尧图网络 高端网站定制 · 原创设计
免费咨询热线
400-888-6620
免费获取方案
Midscene.js 上手指南:三步跑通你的第一次 AI 视觉驱动 UI 测试
Midscene.js 上手指南三步跑通你的第一次 AI 视觉驱动 UI 测试【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene网页上一个按钮换了样式写好的选择器就全部失效UI 自动化脚本随之报废。Midscene.js 是一个面向 E2E 测试的 GUI Agent它让 AI 直接看屏幕截图来定位元素、执行操作、验证结果你用自然语言描述测试意图不必再维护一堆脆弱的选择器。同一套 Agent API 覆盖 Web、Android、iOS、HarmonyOS 和桌面端。选择器失效时换一种测试思路传统 UI 测试依赖选择器class 名一变、结构一调脚本就要跟着改。更麻烦的是纯图标按钮、canvas绘制的内容、跨域 iframe 里的元素写选择器本身就很难。Midscene 的做法仿照人的操作习惯观察屏幕根据看到的内容操作再检查界面上可见的结果。它根据元素的外观和位置做定位完成点击、输入、滚动断言同样是看一眼屏幕用自然语言描述预期外观即可例如选中的套餐带有蓝色边框和勾选标记。第一次体验在浏览器里跑通一条指令最快的路径是 Chrome 扩展版 Playground不需要搭项目安装 Midscene Chrome Extension在扩展侧边栏的设置页粘贴一组多模态模型配置需要一个具备 UI 定位能力的视觉模型参考 快速开始文档打开任意网页在侧边栏输入自然语言指令比如点击登录按钮、提取页面中的商品列表、页面顶部显示导航栏观察 AI 如何理解页面、执行操作并返回结果。成功的样子是你不用写任何代码AI 自己找到按钮并点击或者按你要求的结构返回了页面数据。想从源码跑完整项目则执行git clone https://gitcode.com/GitHub_Trending/mid/midscene克隆后在根目录执行pnpm install即可开始浏览各平台模块。 一套 API所有平台Android 真机开 USB 调试就能连手机开启 USB 调试含安全设置装好 adb 并用adb devices -l确认设备可见然后启动 Playgroundnpx --yes midscene/android-playground在窗口里的齿轮按钮中粘贴 API Key 配置即可在真机上输入自然语言指令。文档中的演示任务打开懂车帝搜索 SU7 车型查看参数配置就是直接对真实手机执行的。Playground 与midscene/androidSDK 共享同一套实现你在界面上验证过的流程写成脚本行为完全一致。各平台细节见 Android 指南。从 Playground 到测试脚本在浏览器里跑通的指令可以直接搬进 Playwright 脚本。Agent 完成操作后还能等待条件、断言结果await agent.aiAct(搜索耳机然后将结果筛选为价格低于 100 美元); await agent.aiWaitFor(筛选后的搜索结果已显示); await agent.aiAssert(搜索结果中的每件商品价格都低于 100 美元); 测试跑完你得到什么可回放的 HTML 报告每次运行都会生成 HTML 报告打开后可以像回放录像一样逐步查看每一步的截图、元素定位框、AI 的决策过程、操作与断言结果失败在哪一步一目了然。运行产物报告、日志、缓存统一放在项目下的midscene_run目录包含report/、log/、cache/三个子目录。⚙️ 跑生产前的三条实用建议模型先选一个简单的先用一个能定位 UI 的多模态模型把流程跑通再考虑按场景组合规划模型与视觉模型文档有专门的模型策略说明。重复任务开缓存相同指令在相似页面上重复执行时命中缓存可跳过模型调用。官方文档给出的案例中同一段脚本执行时间从 51 秒降到 28 秒详见缓存文档。固定操作用即时接口确定的动作直接用aiTap、aiInput比走完整规划的aiAct更快适当调低截图分辨率也能降低 token 消耗。⚠️ 新手最容易踩的坑扩展冲突运行时报Cannot access a chrome-extension:// URL of different extension通常是其他扩展向页面注入了 iframe 或脚本。按文档找到冲突扩展的 ID 并禁用后刷新页面即可。本地 Ollama 报 403设置环境变量OLLAMA_ORIGINS*允许扩展访问本地模型。Android 连不上设备先确认 USB 调试和USB 调试安全设置都已开启再检查 adb 驱动adb devices -l能看到设备才算连通。midscene_run目录出现在项目里这是正常的运行产物目录介意位置的话用MIDSCENE_RUN_DIR环境变量改到别处。 下一步先做这两件事第一件事装好 Chrome 扩展在一个你熟悉的网页上各跑一条aiAct、aiQuery和aiAssert体会自然语言变操作的完整闭环。第二件事把报告打开回放一遍看 AI 是如何定位元素的这会直接影响你之后写断言的措辞。更多平台接入和 API 细节都在仓库内的文档站中核心能力实现集中在packages/core的 Agent 与模型适配层。官方文档apps/site/docs/ 核心源码packages/core/【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
RELATED

相关推荐

Taichi GUI 怎么开启 fast_gui 模式提升 set_image 实时可视化帧率?

Taichi GUI 怎么开启 fast_gui 模式提升 set_image 实时可视化帧率?

Taichi GUI 怎么开启 fast_gui 模式提升 set_image 实时可视化帧率? 【免费下载链接】taichi Productive, portable, and performant GPU programming in Python. 项目地址: https://gitcode.com/GitHub_Trending/ta/taichi 在 Taichi 中用内置 GUI 做实时可…

📅 2026/9/12 16:38:26
低功耗开发实战:对比安卓与嵌入式,从功耗分析到入行路线

低功耗开发实战:对比安卓与嵌入式,从功耗分析到入行路线

前阵子帮一个硬件团队排查「设备待机一晚掉电 30%」的问题,最后定位到罪魁祸首是一颗姿态传感器:固件里每 200ms 轮询一次数据,CPU 永远退不出浅睡眠,整机平均电流从设计值 0.3mA 硬生生拉到 12mA。这个项目让我又一次意识到&…

📅 2026/9/12 16:38:26
基于Arduino的物联网植物养护系统:从土壤传感器到MQTT云端监控

基于Arduino的物联网植物养护系统:从土壤传感器到MQTT云端监控

简介:一套基于Arduino开发板的物联网植物养护系统,是面向单片机与嵌入式学习者的完整项目资源,能够直接应用于毕业设计、课程设计、期末大作业、工程实训以及各类学科竞赛。项目已经过博主严格测试,功能正常,拿到资料后…

📅 2026/9/12 16:38:26
MORE NEWS

更多资讯

📰

LunaTranslator 入门:三步把日文游戏实时翻译成中文(含本地模型搭法)

LunaTranslator 入门:三步把日文游戏实时翻译成中文(含本地模型搭法) 【免费下载链接】LunaTranslator 视觉小说翻译器 / Visual Novel Translator 项目地址: https://gitcode.com/GitHub_Trending/lu/LunaTranslator 剧情走到关键分叉…

📰

Apache Airflow 邮件发送配置与可插拔 Email Backend 完整指南

Apache Airflow 邮件发送配置与可插拔 Email Backend 完整指南 【免费下载链接】airflow Apache Airflow - A platform to programmatically author, schedule, and monitor workflows 项目地址: https://gitcode.com/GitHub_Trending/ai/airflow Apache Airflow 内置了…

📰

planning-with-files 德语任务模板 `task_plan.md` 实战指南:构建崩溃安全的 AI 多阶段任务路线图

planning-with-files 德语任务模板 task_plan.md 实战指南:构建崩溃安全的 AI 多阶段任务路线图 【免费下载链接】planning-with-files Persistent file-based planning for AI coding agents and long-running tasks. Crash-proof markdown plans, session recover…

📰

Angular Material 图标组件测试指南:MatIconHarness 与 MatIconTestingModule 深度解析

Angular Material 图标组件测试指南:MatIconHarness 与 MatIconTestingModule 深度解析 【免费下载链接】components Component infrastructure and Material Design components for Angular 项目地址: https://gitcode.com/GitHub_Trending/co/components a…

📰

如何用 Puter CLI 的 puter app 与 puter worker 子命令查看账号资源?

如何用 Puter CLI 的 puter app 与 puter worker 子命令查看账号资源? 【免费下载链接】puter 🌐 The Internet Computer! Free, Open-Source, and Self-Hostable. 项目地址: https://gitcode.com/GitHub_Trending/pu/puter 如果你在 Puter 上部署…

📰

NautilusTrader Python 指南:基于 PyO3 理解 Rust 核心之上的交易控制面

NautilusTrader Python 指南:基于 PyO3 理解 Rust 核心之上的交易控制面 【免费下载链接】nautilus_trader Production-grade Rust-native trading engine with deterministic event-driven architecture 项目地址: https://gitcode.com/GitHub_Trending/na/nauti…

TODAY

今日更新

THIS WEEK

本周精选

THIS MONTH

本月热门

读完文章,想聊聊您的网站?

告诉我们您的行业与需求,资深顾问一对一梳理方案与报价,全程免费。

📞 💬