e2e-testing

AI 端到端测试 —— 8 个平台，无需编写测试代码

flutter-skill 是一个 MCP 服务，可将 AI Agent 连接到 8 个平台上运行的应用。Agent 通过自然语言进行截图、点击元素、输入文本、滚动、导航、检查 UI 树和验证状态。

支持的平台

平台	设置
Flutter (iOS/Android/Web)	flutter pub add flutter_skill
React Native	npm install flutter-skill-react-native
Electron	npm install flutter-skill-electron
iOS (Swift/UIKit)	SPM：FlutterSkillSDK
Android (Kotlin)	Gradle：flutter-skill-android
Tauri (Rust)	cargo add flutter-skill-tauri
KMP Desktop	Gradle 依赖
.NET MAUI	NuGet 包

安装

# npm (recommended)
npm install -g flutter-skill

# Homebrew
brew install ai-dashboad/flutter-skill/flutter-skill

# Or download binary from GitHub Releases

MCP 配置

将以下内容添加到 AI Agent 的 MCP 配置中（Claude Desktop、Cursor、Windsurf、OpenClaw 等）：

{
  "mcpServers": {
    "flutter-skill": {
      "command": "flutter-skill",
      "args": ["server"]
    }
  }
}

快速开始

1. 初始化应用（一次性操作）

flutter-skill init

自动检测项目类型，并为应用添加测试桥接。

验证： 输出应确认已检测到项目类型，并已修改主入口点。如果失败，请确认当前位于项目根目录，且框架受支持。

2. 启动并连接

flutter-skill launch .

验证： 输出中会显示 VM Service URI（例如 ws://127.0.0.1:50000/ws）。如果没有显示 URI，请确认已安装 Flutter／目标框架，且应用可以编译。

3. 使用自然语言测试

Agent 遵循以下核心循环：

1. screenshot() — 查看当前屏幕
2. inspect_interactive() — 查找所有可点击／可输入的元素及其语义引用
3. tap(ref: "button:Login") — 使用稳定的语义引用点击
4. enter_text(ref: "input:Email", text: "[email protected]") — 在字段中输入文本
5. wait_for_element(key: "Dashboard") — 验证导航是否成功
6. screenshot() — 确认最终状态

如果 inspect_interactive() 未返回任何元素： 截图确认屏幕已加载，然后使用 get_logs() 检查错误。应用可能仍在加载——稍等片刻后重试。

可用的 MCP 工具

核心操作

工具	描述
screenshot	将当前屏幕捕获为图像
tap	按键、文本、引用或坐标点击元素
enter_text	在字段中输入文本
scroll	向上／下／左／右滚动
swipe	在两点之间执行滑动手势
long_press	长按元素
drag	从 A 点拖动到 B 点
go_back	返回上一页
press_key	发送键盘按键事件

检查

工具	描述
inspect_interactive	获取所有交互元素及其语义引用 ID
get_elements	列出屏幕上的所有元素
find_element	按键或文本查找元素
wait_for_element	等待元素出现（带超时）
get_element_properties	获取元素的详细属性

文本操作

工具	描述
set_text	替换字段中的文本
clear_text	清空文本字段
get_text	读取文本内容

应用控制

工具	描述
get_logs	读取应用日志
clear_logs	清除日志缓冲区

语义引用

inspect_interactive 会返回带有稳定语义引用 ID 的元素：

button:Login          → Login button
input:Email           → Email text field
toggle:Dark Mode      → Dark mode switch
button:Submit[1]      → Second Submit button (disambiguated)

格式：{role}:{content}[{index}]

7 种角色：button、input、toggle、slider、select、link、item

使用引用可以可靠地定位元素，即使 UI 发生变化也能正常工作：

tap(ref: "button:Login")
enter_text(ref: "input:Email", text: "[email protected]")

测试工作流

核心循环

screenshot() → inspect_interactive() → tap/enter_text → screenshot() → verify

始终在操作前后调用 screenshot()。导航后使用 wait_for_element()——应用需要时间完成页面切换。

验证检查点

• 调用 screenshot() 后：确认显示的是预期屏幕，再执行操作。
• 调用 tap() 或 enter_text() 后：调用 screenshot()，验证 UI 已响应。
• 导航后：使用带超时设置的 wait_for_element(key: "target_screen")。如果超时，调用 screenshot() 和 get_logs() 进行诊断。
• 出现意外状态时：调用 get_logs() 和 inspect_interactive()，了解当前存在的元素。

元素定位优先级

1. ref:（最可靠）——来自 inspect_interactive() 的语义 ref
2. key: ——由开发者设置的组件 key
3. text: ——可见文本内容（文本变化时容易失效）
4. 坐标 ——最后手段，在不同屏幕尺寸下可能失效

链接

• GitHub
• npm
• 文档
• pub.dev
• VSCode 扩展