#开始使用：Web · Midscene Test · 模型 API Key

本页是在 Web 上使用 Midscene Test、通过模型 API Key 接入模型的配置步骤。如需其他组合，请修改下方的选择，或查看全部配置路径。

第 1 步

#安装 Node.js

安装 Node.js ^20.19.0 || ^22.12.0 || >=24.0.0，并确认终端中可以执行 node -v。

下文命令使用 pnpm。如果尚未安装，请运行 npm install -g pnpm。

第 2 步

#创建测试项目

pnpm dlx @midscene/test create my-tests \
  --platform web \
  --package-manager pnpm
cd my-tests

该命令会生成项目文件、安装依赖并生成 Node 说明书，不会运行测试。生成的文件说明请参阅项目结构。

第 3 步

#配置模型

在 my-tests 目录中，将 .env.example 复制为 .env：

cp .env.example .env

在下方选择一个模型，它的配置包含四项。点击获取 API Key到服务商创建 API Key，再用它替换 MIDSCENE_MODEL_API_KEY 中的 ......。

MIDSCENE_MODEL_BASE_URL="https://ark.cn-beijing.volces.com/api/v3"
MIDSCENE_MODEL_API_KEY="......"
MIDSCENE_MODEL_NAME="doubao-seed-2-1-turbo-260628"
MIDSCENE_MODEL_FAMILY="doubao-seed"

其他版本与使用说明请参阅豆包 Seed 系列。

各模型的差异请参阅模型选择指南。UI-TARS 等兼容模型请参阅使用模型 API Key。

用这份配置填写 .env 中的四项 MIDSCENE_MODEL_* 变量。

第 4 步

#验证模型并完成配置

运行以下命令，检查模型能否连通、是否与 Midscene 兼容。该命令只读取当前目录下的 .env，不需要浏览器或设备：

pnpm exec midscene-test model verify

如果验证失败，请参阅验证模型连接。

为 Playwright 安装 Chromium：

pnpm exec playwright install chromium

第 5 步

#运行示例并查看报告

示例会在 Chromium 中打开 React TodoMVC，预置三条待办事项，然后通过 aiAct 和 aiAssert 修改并检查它们。

pnpm test

终端会输出测试结果和 Report: 报告路径。打开 HTML 报告，选择用例和步骤即可查看截图、输入输出和错误信息。报告默认保存在 midscene_run/report/ 目录下。

用例通过即表示模型、运行环境和项目都已正常工作。运行参数请参阅运行测试。

第 6 步

#下一步

• 查看更多案例：案例展示收录了各平台的演示视频和完整执行报告。

• 测试自己的网站：在 cases/todo.yaml 中，将 beforeEach 里的 TodoMVC 初始化步骤替换为打开你的 URL 的 gotoUrl Node，再用 aiAct 和 aiAssert 描述步骤。请参阅各平台预置 Node。

• 编写和组织用例：编写 YAML 用例介绍了输入、变量、标签和 hooks。
• 在 CI 中运行：请参阅在 GitHub Actions 中运行。

想尝试其他平台或使用方式？回到顶部修改选择。