简体中文

English
简体中文

像人一样看懂界面用自然语言完成 E2E 测试

Midscene.js 帮助开发者将 AI 引入 E2E 测试，提供基于视觉的 GUI Agent 与可扩展的测试框架，覆盖 Web、移动端和桌面应用。

使用文档案例展示

15k+Github Stars

#2Github 趋势榜第2名

@midscene/test + yaml 格式的用例

beforeEach:
  - gotoUrl: https://your-shop.example

cases:
  - name: "筛选 100 美元以下的耳机"
    steps:
      - aiAct: "搜索耳机，然后将结果筛选为价格低于 100 美元"
      - aiWaitFor: "筛选后的搜索结果已显示"
      - aiAssert: "搜索结果中有商品，且每件商品价格都低于 100 美元"

Vitest + JavaScript

import { test } from 'vitest';
import { PlaywrightAgent } from '@midscene/web/playwright';

// 省略模型配置、page 初始化与资源清理
test("筛选 100 美元以下的耳机", async () => {
  const agent = new PlaywrightAgent(page);
  await agent.aiAct("搜索耳机，然后将结果筛选为价格低于 100 美元");
  await agent.aiWaitFor("筛选后的搜索结果已显示");
  await agent.aiAssert("搜索结果中有商品，且每件商品价格都低于 100 美元");
}, 180_000);

截图定位与操作

直接根据截图定位元素并操作界面，无需维护选择器或额外标注，支持 Canvas 等自定义界面。

支持多种模型

支持豆包、DeepSeek、Qwen、GPT、Gemini、Kimi 等模型，按效果与预算选择。

低模型调用成本

以豆包 Seed 2.1 Turbo 为例：该次 AppControlBench 评测中，60 项任务通过 58 项，模型调用总费用为 $0.59。

查看评测报告

验证用户看到的结果

用自然语言描述预期颜色、布局与状态，通过视觉断言检查界面实际呈现的效果。

Web
@midscene/web
Playwright · Puppeteer · 桌面 Chrome
Playwright Puppeteer Bridge 模式
Android
@midscene/android
真机 / 模拟器 · ADB
接入指南
iOS
@midscene/ios
真机 / 模拟器 · WebDriverAgent
接入指南
HarmonyOS
@midscene/harmony
HarmonyOS NEXT · HDC
接入指南
桌面
@midscene/computer
macOS · Windows · Linux，支持远程 RDP
接入指南
自定义界面
@midscene/core
提供截图与操作能力，即可接入
扩展指南

@midscene/test

用 YAML 组织用例用 TypeScript 扩展

用自然语言组织测试用例

在 YAML 中组合界面操作、断言与业务节点，专注描述测试流程。

把业务能力封装为可复用节点

用 TypeScript 实现数据准备、接口调用与清理，供不同用例复用。

自动生成 Node 说明书

将已注册节点与参数定义导出为 Markdown，让开发者和 AI Agent 了解项目能力，共同编写与维护用例。

了解 Midscene Test

YAML 用例

TypeScript 扩展节点

Node Spec

# cases/users.yaml
# 示例：准备用户数据，再通过界面搜索并验证。需先配置模型与 Web 运行环境，并替换示例网址。

beforeEach:
  - user.create: { name: Alice }
  - gotoUrl: https://your-app.example/users

cases:
  - name: 搜索新建用户
    steps:
      - aiAct: 搜索用户名 Alice
      - aiAssert: 搜索结果中显示用户 Alice

// nodes.ts
// user.create 对应 YAML 中的同名步骤；userService 是你实现的业务接口，负责创建和删除测试用户。

import { defineNode, z } from '@midscene/test';
import { userService } from './user-service';

export const createUser = defineNode({
  name: 'user.create',
  description: "创建测试用户，并在用例结束后清理",
  inputSchema: z.strictObject({ name: z.string() }),
  async execute({ input, onTeardown }) {
    const user = await userService.create(input);
    onTeardown(() => userService.remove(user.id));
  },
});

<!-- midscene-node-spec.md
运行 pnpm exec midscene-test nodes 自动生成。这里展示 user.create 的说明片段，与 TypeScript 节点定义对应。 -->

### `user.create`

创建测试用户，并在用例结束后清理

**String shorthand:** Not supported by this Node.

#### Input Schema

```json
{
  "type": "object",
  "properties": { "name": { "type": "string" } },
  "required": ["name"]
}
```

<!-- 其余 Schema 字段与节点说明省略。 -->

丰富而灵活的 API

覆盖自动规划、精细操作、视觉断言与数据提取，灵活接入已有测试工程。

回放执行，交互调试

通过报告回看截图、AI 决策与执行结果，在 Playground 中试验和调整指令。

让 AI 编程 Agent 操作界面

通过 Midscene Skills，让 AI 编程 Agent 操作应用、验证界面，查看执行结果。

93.1%Pass@1 93.1% · Pass@3 97.4%

用自然语言，写下你的第一个 E2E 测试

开始使用查看案例

像人一样看懂界面用自然语言完成 E2E 测试

用自然语言描述步骤与预期

@midscene/test + yaml 格式的用例

Vitest + JavaScript

视觉驱动低成本运行测试

截图定位与操作

支持多种模型

低模型调用成本

验证用户看到的结果

一套 API，覆盖不同平台

Web

Android

iOS

HarmonyOS

桌面

自定义界面

用 YAML 组织用例用 TypeScript 扩展

用自然语言组织测试用例

把业务能力封装为可复用节点

自动生成 Node 说明书

完整的 AI Native 测试工具链

丰富而灵活的 API

回放执行，交互调试

让 AI 编程 Agent 操作界面

Benchmark 成绩

AndroidWorld Benchmark

MobileWorld Benchmark

AppControlBench Benchmark

谁在使用 Midscene

用自然语言，写下你的第一个 E2E 测试