flutter-skill：255个MCP工具，让AI真正“看见“并测试你的App（10个平台）
前言
在 Vibe Coding 时代，AI 已经能帮我们写代码了。但有一个问题一直没解决：AI 能测试你的 App 吗？
不是跑单元测试，而是真正像用户一样：点按钮、输入文字、滑动页面、截图验证结果。
flutter-skill 就是为此而生的开源工具。它是一个 MCP (Model Context Protocol) 服务器，让 Claude、Cursor、Windsurf 等 AI 工具直接操控你的应用 UI。
GitHub: https://github.com/ai-dashboad/flutter-skill
核心亮点
- 255 个 MCP 工具：涵盖 tap、type、scroll、screenshot、snapshot、upload_file、Shadow DOM 穿透、网络拦截、API 测试等
- 10 个平台：Flutter iOS/Android/Web、Electron、Tauri、KMP、React Native、.NET MAUI、Web CDP、iOS Native
- 656/664 测试通过（98.8%）：全部由 AI 驱动，零手写测试代码
- snapshot() 节省 99% Token：相比截图，无障碍树文本表示极其高效，这也是微软 Playwright MCP 在 README 中承认的痛点
- 30 秒集成：
flutter-skill init自动检测框架并注入 Bridge SDK
与竞品对比
| 工具 | MCP 工具数 | 平台数 | 特色 |
|---|---|---|---|
| flutter-skill | 255 | 10 | 全平台、Shadow DOM、视频录制、并行多设备 |
| Playwright MCP (微软) | ~33 | 1 (Web) | 浏览器自动化 |
| browser-use | ~15 | 1 (Web) | AI 浏览器代理 |
| Midscene | ~20 | 2 | 视觉 AI 测试 |
快速上手
安装
# npm npm i -g flutter-skill-mcp # Homebrew brew tap nicholasmurray/tap brew install flutter-skill # 或者直接用 Dart dart pub global activate flutter_skill浏览器自动化（零配置）
# 启动 serve 模式，连接到任意网站 flutter-skill serve https://your-app.com --port=3000 # AI 现在可以通过 MCP 协议控制浏览器了 # snapshot() 返回无障碍树，比截图节省 99% tokenApp 测试（30 秒集成）
# 自动检测框架，注入 Bridge SDK flutter-skill init # 启动 demo 验证 flutter-skill demo # 在 Claude/Cursor 的 MCP 配置中添加 flutter-skill # 然后对 AI 说："测试登录流程"新功能：QR 码扫码登录自动化
v0.9.6 新增 qr_login_start 和 qr_login_wait 工具，支持任何需要扫码登录的平台（微信、ZEEKLOG、知乎、钉钉等）：
- AI 调用
qr_login_start→ 自动检测页面上的二维码并截图 - AI 将图片发到 Telegram/聊天 → 用户手机扫码
- AI 调用
qr_login_wait→ 自动检测登录成功（URL 变化、Cookie 变化、二维码消失）
技术架构
flutter-skill 采用 WebSocket JSON-RPC 2.0 协议：
- Bridge SDK：嵌入到目标 App 中，暴露 UI 树和操作接口
- MCP Server：Dart 编写，处理 AI 工具调用请求
- CDP Driver：直接通过 Chrome DevTools Protocol 操控浏览器
为什么选 WebSocket？双向通信、有状态连接、跨平台通用、JSON 可读可调试。HTTP 轮询慢 10x，gRPC 集成难 10x。
性能数据
- tap 操作：1ms
- CDP 连接：93ms
- snapshot：2ms
- screenshot：31ms
总结
flutter-skill 填补了 AI 辅助开发的最后一块拼图：让 AI 不仅能写代码，还能测试代码。
255 个工具、10 个平台、656 个测试、MIT 开源。
⭐ 如果觉得有用，欢迎 Star：https://github.com/ai-dashboad/flutter-skill
