ARTICLE · INTELLIGENCE

战地情报 · 详情页

来自尧图项目组的一线实战观察与深度解析

如何用 @midscene/test 创建 Web 测试项目并运行示例用例

如何用 @midscene/test 创建 Web 测试项目并运行示例用例 如何用 midscene/test 创建 Web 测试项目并运行示例用例【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscenemidscene/testMidscene Test是 Midscene 提供的 AI 端到端测试框架测试用例用 YAML 声明式描述。本文的任务是从零创建一个 Web 平台的测试项目配置好模型运行环境跑通框架生成的示例用例并查看运行报告。适用前提本机已安装 Node.js^20.19.0 || ^22.12.0 || 24.0.0和 pnpm并且你已有一个 OpenAI 兼容多模态模型的 API Key。Midscene Test 目前处于 Beta 状态测试协议和 API 仍在演进。1. 生成 Web 测试项目在项目根目录执行pnpm dlx midscene/test create my-tests --platform web --package-manager pnpm cd my-tests命令会提示你安装依赖按提示操作即可。--platform web表示项目基于 Playwright 驱动浏览器查看全部可用参数可以运行pnpm dlx midscene/test create --help。生成完成后目录结构如下my-tests/ ├── cases/example.yaml # 示例用例 ├── midscene.config.ts # 平台配置和 Node 注册 ├── midscene-node-reference.md # 安装后生成的 Node 参考文档 ├── package.json ├── tsconfig.json ├── .env.example └── README.md两点说明创建和生成 Node 参考文档这两步不运行测试因此不需要模型 API Key、浏览器或设备生成的package.json中定义了test即midscene-test、nodes即midscene-test nodes两个脚本且postinstall会自动重新生成midscene-node-reference.md。安装恢复如果创建时跳过或安装失败进入项目目录补跑pnpm install如果 Node 参考文档没有生成手动运行pnpm run nodes。2. 配置模型与 Web 运行环境2.1 配置模型环境变量把.env.example复制为.env然后填入模型配置。生成的.env.example内容如下# Copy this file to .env before running tests. # Do not commit .env to your repository. In CI, inject these values as environment variables instead. MIDSCENE_MODEL_BASE_URL MIDSCENE_MODEL_API_KEY MIDSCENE_MODEL_NAME MIDSCENE_MODEL_FAMILY HEADLESStrue四个必填项的含义来自 Model Configuration ReferenceMIDSCENE_MODEL_API_KEYOpenAI 兼容 HTTP 服务方的 API Key例如sk-abcd...MIDSCENE_MODEL_BASE_URLAPI 端点 URL通常以版本结尾如/v1不要在这里拼接/chat/completion底层 SDK 会自动追加MIDSCENE_MODEL_NAME模型名MIDSCENE_MODEL_FAMILY模型家族决定 Midscene 如何处理坐标。具体填什么值取决于你使用的模型服务方。每个支持的模型都要求同时给出 Base URL、API Key、模型名和MIDSCENE_MODEL_FAMILY四项。以火山引擎的 Doubao Seed 系列为例摘自 Supported models and setup 的文档示例API Key 需替换为你自己的值MIDSCENE_MODEL_BASE_URLhttps://ark.cn-beijing.volces.com/api/v3 # Volcano Engine endpoint MIDSCENE_MODEL_API_KEY.... MIDSCENE_MODEL_NAMEdoubao-seed-2-1-turbo-260628 MIDSCENE_MODEL_FAMILYdoubao-seed其他模型家族Qwen、DeepSeek、Gemini、GPT、Kimi 等的配置同样可以在该文档中按支持的模型逐条查找。注意文档中MIDSCENE_MODEL_FAMILY的取值必须与模型名匹配它决定 Midscene 对该模型的适配方式不能省略。文件末尾的HEADLESStrue是 Web 平台的环境变量设为true时浏览器以无头模式启动改为false则可看到浏览器窗口。2.2 安装 ChromiumWeb 平台首次运行前还需要安装 Playwright 的 Chromium 浏览器pnpm exec playwright install chromium3. 运行生成的示例用例回到项目根目录执行pnpm testWeb 平台的示例用例cases/example.yaml内容为打开https://example.com然后断言页面标题cases: - name: Open example.com steps: - gotoUrl: https://example.com - aiAssert: The page displays the heading Example DomaingotoUrl是 Web 项目提供的 Node用于打开页面aiAssert用来检查预期结果不满足时该步骤失败。CLI 的退出码约定当测试用例失败、YAML 文档无法解析或收集阶段发生错误时进程以退出码1结束。因此可以用echo $?判断这次运行是否全部通过。4. 查看运行报告每次运行结束后CLI 会打印结果摘要和一个Report:路径。报告默认保存在midscene_run/report/test-run-runId.html其中runId是本次运行的标识。用浏览器打开这个 HTML 报告可以逐条查看项目、用例、重试次数、截图、每个 Step 的输入输出、错误信息和相关的 Agent 执行轨迹。如果想更换报告输出目录在midscene.config.ts中设置output.reportDir。判断成功的依据是终端结果中用例Open example.com状态为通过且aiAssert步骤通过同时退出码为0。5. 后续步骤跑通示例后按官方文档给出的路径继续编辑cases/example.yaml写自己的用例可用的 Node 及输入参数见项目内的midscene-node-reference.md该参考在安装时自动生成供人和 AI Agent 共同使用修改了midscene.config.ts中的 Node 注册后运行pnpm run nodes重新生成参考文档。这一步只加载配置不连接设备、不运行测试只跑特定目录或文件时用pnpm exec midscene-test ./cases/order.yaml这类带路径参数的形式而不是不带参数的全量运行。更多配置项执行生命周期、多 Execution Project、超时与错误处理见 Configure test projects编写自定义业务 Node 见 Develop custom Nodes。【免费下载链接】midsceneGUI Agent for E2E Testing项目地址: https://gitcode.com/GitHub_Trending/mid/midscene创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
RELATED READING

延伸阅读

更多一线实战笔记与深度复盘,助您持续精进