Midscene.js：视觉驱动的 GUI 自动化與 E2E 測試
適用於每個平台的人工智慧驅動、視覺驅動的 UI 自動化。有兩種測試方法，將 Midscene 添加到您的 Playwright / Vitest 套件中，或讓 AI 代理程式通過技能進行自主測試。
秒懂
- 它是什麼？
- web-infra-dev/midscene 用截圖與自然语言驱动 UI 操作，可接入 Playwright/Vitest 或通過 Midscene Skills 自主測試，支持 Web、Android、iOS 等平台。
- 適合誰用？
- Midscene 適合 DOM 选择器 fragile、需要斷言用户可见布局的 E2E 場景。它不適合无法提供多模态模型 API 或不愿為截圖推理付 token 成本的团队。
- 可以商用嗎？
- 可以。MIT 是寬鬆授權：你可以使用、修改並販售以它為基礎的軟體，只需保留著作權與授權聲明。
- 還在維護嗎？
- 有在維護。儲存庫最近一次提交在 1 天前。
- 用什麼語言寫的？
- 主要是 TypeScript（依據 GitHub 的語言統計）。
以上回答依據專案的 GitHub 資料（最近同步於 2026年9月14日）與我們的分析，不構成法律意見。
開源專案深度解析
纯视觉而非 DOM 选择器
Why Midscene：Most UI automation depends on DOM or accessibility tree，selectors break，canvas 與 cross-origin iframe 难覆盖。Midscene works from screenshot alone，natural language steps。Less maintenance；Reach every element；Assert what users actually see。Two ways：Playwright Vitest suite 或 Skills autonomous agent。
围绕 web/infra 的「纯视觉而非 DOM 选择器」，命令行参數 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「纯视觉而非 DOM 选择器」，配置文件路径 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「纯视觉而非 DOM 选择器」，默认端口 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「纯视觉而非 DOM 选择器」，日志關键字 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「纯视觉而非 DOM 选择器」，版本 tag 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「纯视觉而非 DOM 选择器」，依赖安装 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「纯视觉而非 DOM 选择器」，错误码 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「纯视觉而非 DOM 选择器」，文檔章节 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
web-infra-dev-midscene-deep-analysis 第 1 节收尾：在 web/infra 克隆目錄执行與本节相關的 README 命令，记錄退出码、命令行参數 观測值與 stderr 摘要。
平台與 API aiAct aiQuery
Works on web Android iOS HarmonyOS desktop custom interface。JavaScript SDK 或 YAML；Skills 给 OpenClaw。API reference aiAct aiQuery aiAssert midscenejs.com/reference/#common。Showcases 含 GitHub form register、Meituan coffee、Android hotel booking 等 midscenejs.com/showcases。
围绕 web/infra 的「平台與 API aiAct aiQuery」，配置文件路径 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「平台與 API aiAct aiQuery」，默认端口 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「平台與 API aiAct aiQuery」，日志關键字 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「平台與 API aiAct aiQuery」，版本 tag 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「平台與 API aiAct aiQuery」，依赖安装 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「平台與 API aiAct aiQuery」，错误码 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「平台與 API aiAct aiQuery」，文檔章节 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「平台與 API aiAct aiQuery」，命令行参數 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
web-infra-dev-midscene-deep-analysis 第 2 节收尾：在 web/infra 克隆目錄执行與本节相關的 README 命令，记錄退出码、配置文件路径 观測值與 stderr 摘要。
多模态模型策略
Driven by Multimodal Models：element localization based on screenshots only。Models Qwen3.x Doubao-Seed-2.1 GLM-4.6V gemini-3.5-flash UI-TARS 可自托管。Model Strategy midscenejs.com/model-strategy。Data extraction 可 opt in DOM。
围绕 web/infra 的「多模态模型策略」，默认端口 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「多模态模型策略」，日志關键字 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「多模态模型策略」，版本 tag 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「多模态模型策略」，依赖安装 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「多模态模型策略」，错误码 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「多模态模型策略」，文檔章节 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「多模态模型策略」，命令行参數 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「多模态模型策略」，配置文件路径 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
web-infra-dev-midscene-deep-analysis 第 3 节收尾：在 web/infra 克隆目錄执行與本节相關的 README 命令，记錄退出码、默认端口 观測值與 stderr 摘要。
Midscene Skills 與 OpenClaw
Midscene Skills github.com/web-infra-dev/midscene-skills 配合 OpenClaw 測試 web mobile desktop。release v1.12.2。Community Discord midscene_ai X。Sample midscene-example 仓庫。Built with Rsbuild Rslib UI-TARS Qwen-VL scrcpy Playwright Puppeteer credits。
围绕 web/infra 的「Midscene Skills 與 OpenClaw」，日志關键字 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Midscene Skills 與 OpenClaw」，版本 tag 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Midscene Skills 與 OpenClaw」，依赖安装 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Midscene Skills 與 OpenClaw」，错误码 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Midscene Skills 與 OpenClaw」，文檔章节 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Midscene Skills 與 OpenClaw」，命令行参數 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Midscene Skills 與 OpenClaw」，配置文件路径 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Midscene Skills 與 OpenClaw」，默认端口 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
web-infra-dev-midscene-deep-analysis 第 4 节收尾：在 web/infra 克隆目錄执行與本节相關的 README 命令，记錄退出码、日志關键字 观測值與 stderr 摘要。
MIT 與 Awesome 生态
MIT license。Awesome 社區 midscene-ios midscene-pc Midscene-Python midscene-java 等扩展。star 约 14734。open issues 77。Official Website midscenejs.com。
围绕 web/infra 的「MIT 與 Awesome 生态」，版本 tag 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「MIT 與 Awesome 生态」，依赖安装 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「MIT 與 Awesome 生态」，错误码 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「MIT 與 Awesome 生态」，文檔章节 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「MIT 與 Awesome 生态」，命令行参數 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「MIT 與 Awesome 生态」，配置文件路径 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「MIT 與 Awesome 生态」，默认端口 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「MIT 與 Awesome 生态」，日志關键字 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
web-infra-dev-midscene-deep-analysis 第 5 节收尾：在 web/infra 克隆目錄执行與本节相關的 README 命令，记錄退出码、版本 tag 观測值與 stderr 摘要。
Chrome Quick start 試装
midscenejs.com/quick-start 配置 model 安装 Chrome extension 跑 first natural language instruction。Playwright integrate-with-playwright 寫 Agent script。固定 v1.12.2 與模型名如 UI-TARS。aiAssert 驗證頁面颜色 layout。记錄截圖 token 用量與失败步骤。
围绕 web/infra 的「Chrome Quick start 試装」，依赖安装 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Chrome Quick start 試装」，错误码 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Chrome Quick start 試装」，文檔章节 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Chrome Quick start 試装」，命令行参數 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Chrome Quick start 試装」，配置文件路径 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Chrome Quick start 試装」，默认端口 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Chrome Quick start 試装」，日志關键字 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
围绕 web/infra 的「Chrome Quick start 試装」，版本 tag 應在 web-infra-dev-midscene-deep-analysis 試装笔记里单独成段：對照 README 寫下實际观測值，與官方描述不一致处標「文檔未说明」，勿用其它項目的经驗替代。
web-infra-dev-midscene-deep-analysis 第 6 节收尾：在 web/infra 克隆目錄执行與本节相關的 README 命令，记錄退出码、依赖安装 观測值與 stderr 摘要。
編輯結論
Midscene 適合 DOM 选择器 fragile、需要斷言用户可见布局的 E2E 場景。它不適合无法提供多模态模型 API 或不愿為截圖推理付 token 成本的团队。先在 midscenejs.com/quick-start 配置模型與 Chrome 扩展跑第一条自然语言指令，再用 Playwright 集成文檔寫最小 aiAct 脚本並固定 Qwen 或 UI-TARS 模型版本。
社群筆記