Midscene.js用自然语言重新定义UI自动化让AI成为你的第二双手【免费下载链接】midsceneAI-powered, vision-driven UI automation for every platform.项目地址: https://gitcode.com/GitHub_Trending/mid/midscene你是否还在为繁琐的DOM选择器而烦恼是否曾因为页面重构而重写整个自动化脚本Midscene.js正在用AI视觉技术彻底改变这一切——它让你用自然语言告诉计算机做什么而不是教它怎么做。想象一下这样的场景你需要测试一个新上线的电商应用传统方法需要你编写数十个选择器定位每个按钮和输入框。而使用Midscene.js你只需要说点击登录按钮输入用户名和密码然后搜索无线耳机找到第一个商品并截图价格。是的就这么简单。传统UI自动化的选择器噩梦 vs Midscene的视觉思维传统的UI自动化工具像是给盲人描述房间布局——你需要精确地告诉它往前走三步向右转伸手摸到第二个门把手。而Midscene.js更像是给一个视力正常的人指路看到那个红色的登录按钮了吗点它。传统方式的三大痛点脆弱的选择器页面结构一变脚本立即失效平台壁垒Web、iOS、Android需要三套不同的技术栈学习曲线陡峭XPath、CSS选择器、Appium定位策略...Midscene.js的革命性突破视觉优先像人一样看屏幕理解界面元素自然语言驱动用人类语言描述操作无需编程语法跨平台统一一套YAML脚本多端通用核心理念AI视觉识别如何让自动化开眼Midscene.js的核心技术可以用一个简单的比喻理解它给计算机装上了眼睛和大脑。传统的自动化工具只能摸到DOM节点而Midscene.js能够看到整个屏幕理解界面元素的视觉特征、文字内容和相对位置。这个视觉大脑基于先进的视觉语言模型能够识别按钮、输入框、文本等UI元素无论它们有没有语义标记理解元素的上下文关系比如搜索框旁边的蓝色按钮适应UI的微小变化不会因为像素级调整而失效Midscene.js的Android Playground界面左侧用自然语言规划操作步骤右侧实时投影设备屏幕三大差异化优势为什么Midscene.js与众不同维度传统工具Midscene.js用户收益元素定位依赖DOM/XPath/CSS选择器基于视觉特征识别重构不影响脚本维护成本降低90%学习门槛需要编程测试框架知识只需要会描述操作步骤产品经理、测试人员都能上手跨平台需要学习不同技术栈统一YAML语法自动适配一套脚本覆盖Web、iOS、Android智能程度机械执行预设步骤AI理解意图自适应调整处理动态加载、弹窗等复杂场景调试体验控制台日志截图可视化操作回放实时预览问题定位时间减少80%3分钟快速体验从零到第一个自动化脚本第一步环境准备1分钟# 克隆项目 git clone https://gitcode.com/GitHub_Trending/mid/midscene cd midscene # 安装依赖 pnpm install # 构建项目 pnpm build第二步编写你的第一个脚本1分钟创建一个简单的YAML文件first-test.yamlname: 我的第一个Midscene脚本 steps: - action: aiNavigate params: url: https://www.baidu.com - action: aiType params: text: Midscene.js是什么 target: 搜索框 - action: aiTap params: target: 百度一下按钮第三步运行并查看结果1分钟# 运行Web自动化脚本 npx midscene/web run first-test.yaml立即见效你会看到浏览器自动打开百度输入搜索词并点击搜索按钮——整个过程完全由AI视觉驱动无需编写任何选择器代码Midscene.js的Web Playground左侧配置操作指令右侧实时显示目标页面应用全景从简单测试到复杂工作流场景一电商价格监控自动化想象你需要在多个电商平台监控某个商品的价格变化。传统方法需要为每个平台编写不同的爬虫和选择器而Midscene.js只需要一套脚本name: 多平台价格监控 steps: - action: aiNavigate params: url: {{platform_url}} - action: aiType params: text: {{product_name}} target: 搜索框 - action: aiTap params: target: 搜索按钮 - action: aiExtract params: target: 第一个商品的价格 saveAs: current_price - action: aiAssert params: condition: current_price应该小于{{threshold}}场景二移动端应用回归测试对于移动应用Midscene.js同样表现出色。无论是Android还是iOS你都可以用相同的逻辑编写测试name: 社交应用登录测试 platform: android # 或 ios steps: - action: aiLaunchApp params: appName: 微信 - action: aiTap params: target: 登录按钮 - action: aiType params: text: {{username}} target: 手机号输入框 - action: aiType params: text: {{password}} target: 密码输入框 - action: aiTap params: target: 登录 - action: aiAssert params: condition: 应该显示主页面Midscene.js同样支持iOS设备操作逻辑与Android保持一致场景三Bridge模式远程控制对于需要与本地环境交互的复杂场景Midscene.js提供了Bridge模式import { AgentOverChromeBridge } from midscene/web; // 连接到当前浏览器标签页 const bridge new AgentOverChromeBridge(); await bridge.connectCurrentTab(); // 执行自然语言指令 await bridge.aiAction(打开GitHub搜索Midscene.js点击第一个结果);Bridge模式允许通过本地终端控制浏览器实现脚本与手动操作的完美结合进阶路线图从入门到精通的四个阶段阶段一基础掌握1-2天学习YAML基本语法掌握常用actionaiNavigate、aiType、aiTap、aiAssert完成第一个跨平台测试脚本学习资源快速开始指南docs/en/android-getting-started.mdx基础示例packages/web-integration/demo/阶段二实战应用3-7天学习变量和模板语法掌握条件判断和循环集成到CI/CD流水线实战项目电商价格监控系统社交媒体自动发布工具移动应用冒烟测试套件阶段三高级优化1-2周配置自定义AI模型优化截图质量和识别精度编写复杂业务工作流高级配置model: provider: openai model: gpt-4-vision-preview temperature: 0.1 screenshot: quality: 90 fullPage: true timeout: 45000 retry: maxAttempts: 3 delay: 2000阶段四专家级扩展1个月开发自定义action集成第三方服务构建企业级自动化平台核心源码参考AI模型集成packages/core/src/ai-model/跨平台适配器packages/playground/src/adapters/YAML解析引擎packages/core/src/yaml/资源导航最短学习路径指南官方文档按优先级排序快速体验docs/en/android-getting-started.mdx - 15分钟完成第一个Android自动化核心概念docs/en/computer-introduction.mdx - 理解Midscene.js的设计哲学API参考docs/en/api.mdx - 所有action的详细说明桥接模式docs/en/bridge-mode.mdx - 高级远程控制技巧示例脚本库基础模板packages/cli/tests/midscene_scripts/ - 从简单到复杂的脚本示例测试用例packages/web-integration/tests/ai/ - 学习最佳实践配置示例apps/studio/src/main/ - Studio应用配置参考社区支持问题反馈查看项目Issues获取常见问题解答功能请求提交你的创意想法贡献指南CONTRIBUTING.md - 参与开源开发立即开始让AI成为你的自动化助手Midscene.js不仅仅是一个工具它代表了一种全新的自动化理念——让计算机理解人类而不是让人类适应计算机。无论你是测试工程师、产品经理还是普通用户都可以用自然语言告诉Midscene.js你想要什么它会像一位得力的助手一样帮你完成。你的第一个行动步骤克隆项目并完成环境搭建用5分钟编写并运行第一个脚本将你的手动测试任务转换为Midscene脚本分享你的使用经验帮助改进这个开源项目记住最好的学习方式就是动手实践。从今天开始让Midscene.js成为你工作中的第二双手把重复性的UI操作交给AI把创造力留给自己。Midscene.js Chrome扩展提供直观的自然语言操作界面直接在浏览器中完成自动化任务关键提示Midscene.js目前需要网络连接调用AI模型服务未来版本将支持本地模型部署。对于需要离线使用的场景建议关注项目更新或考虑企业级部署方案。现在打开终端开始你的AI自动化之旅吧【免费下载链接】midsceneAI-powered, vision-driven UI automation for every platform.项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考