117 lines
3.9 KiB
Markdown
117 lines
3.9 KiB
Markdown
---
|
||
name: "weixin-devtools"
|
||
displayName: "微信开发者工具自动化"
|
||
description: "通过 weixin-devtools-mcp 控制微信开发者工具，支持页面导航、元素快照、截图、表单操作、JS 执行、网络监控、Console 日志等小程序自动化操作"
|
||
keywords: ["微信开发者工具", "小程序调试", "devtools", "wechat", "miniprogram", "截图", "screenshot", "页面快照", "snapshot", "元素点击", "click", "表单", "form", "navigate", "console", "网络请求", "network", "evaluate", "自动化测试", "UI验证"]
|
||
author: "NeoZQYY"
|
||
---
|
||
|
||
# 微信开发者工具自动化 Power
|
||
|
||
通过 weixin-devtools-mcp 控制微信开发者工具，用于小程序 UI 调试、页面验证、自动化测试。
|
||
|
||
## 可用 Server
|
||
|
||
### weixin-devtools
|
||
连接本地微信开发者工具实例，提供完整的小程序自动化能力。
|
||
|
||
前置条件：
|
||
- 微信开发者工具已打开并加载项目
|
||
- 自动化端口 9420 已启用（设置 → 安全 → 服务端口）
|
||
|
||
## 工具分类速查
|
||
|
||
### 连接管理
|
||
| 工具 | 说明 |
|
||
|------|------|
|
||
| `connect_devtools` | 连接开发者工具（支持 auto/launch/connect 策略） |
|
||
| `disconnect_devtools` | 断开连接并清理状态 |
|
||
| `reconnect_devtools` | 重连（可复用上次参数） |
|
||
| `get_connection_status` | 查看连接状态 |
|
||
| `check_environment` | 检查自动化环境配置 |
|
||
| `diagnose_connection` | 诊断连接问题 |
|
||
| `debug_connection_flow` | 调试连接流程 |
|
||
|
||
### 页面导航
|
||
| 工具 | 说明 |
|
||
|------|------|
|
||
| `navigate_to` | 跳转到指定页面（支持参数） |
|
||
| `navigate_back` | 返回上一页 |
|
||
| `switch_tab` | 切换 TabBar 页面 |
|
||
| `relaunch` | 重启小程序并跳转 |
|
||
| `get_current_page` | 获取当前页面信息 |
|
||
|
||
### 元素操作
|
||
| 工具 | 说明 |
|
||
|------|------|
|
||
| `get_page_snapshot` | 获取页面元素快照（含 uid） |
|
||
| `$` | CSS 选择器查找元素 |
|
||
| `click` | 点击元素（支持双击） |
|
||
| `input_text` | 输入文本 |
|
||
| `set_form_control` | 设置表单控件值（picker/switch/slider） |
|
||
| `get_value` | 获取元素值或文本 |
|
||
| `debug_page_elements` | 调试元素获取问题 |
|
||
|
||
### 断言验证
|
||
| 工具 | 说明 |
|
||
|------|------|
|
||
| `assert_text` | 断言元素文本（精确/包含/正则） |
|
||
| `assert_state` | 断言元素状态（可见/启用/选中/聚焦） |
|
||
| `assert_attribute` | 断言元素属性值 |
|
||
|
||
### JS 执行
|
||
| 工具 | 说明 |
|
||
|------|------|
|
||
| `evaluate_script` | 在 AppService 上下文执行 JS |
|
||
|
||
### 监控与调试
|
||
| 工具 | 说明 |
|
||
|------|------|
|
||
| `screenshot` | 页面截图（base64 或保存文件） |
|
||
| `list_console_messages` | 列表查询 console 消息 |
|
||
| `get_console_message` | 获取单条 console 详情 |
|
||
| `get_network_requests` | 获取网络请求记录 |
|
||
| `clear_network_requests` | 清空网络请求记录 |
|
||
| `stop_network_monitoring` | 停止网络监听 |
|
||
|
||
### 等待
|
||
| 工具 | 说明 |
|
||
|------|------|
|
||
| `waitFor` | 等待条件满足（元素出现/消失/文本匹配/延时） |
|
||
|
||
## 典型工作流
|
||
|
||
### 1. 连接 → 导航 → 验证
|
||
```
|
||
connect_devtools → navigate_to → get_page_snapshot → assert_text
|
||
```
|
||
|
||
### 2. 表单填写 → 提交 → 检查结果
|
||
```
|
||
navigate_to → get_page_snapshot → input_text → click → waitFor → assert_text
|
||
```
|
||
|
||
### 3. 截图对比（配合 pixel-audit）
|
||
```
|
||
navigate_to → screenshot → 用 image-compare 对比 H5 截图
|
||
```
|
||
|
||
### 4. 数据验证
|
||
```
|
||
evaluate_script（读取页面 data）→ 对比预期值
|
||
```
|
||
|
||
## Steering
|
||
|
||
| 文件 | 内容 |
|
||
|------|------|
|
||
| `workflow.md` | 连接策略、页面导航模式、元素操作最佳实践、常见问题排查 |
|
||
|
||
加载：激活 Power → `readSteering("workflow.md")`
|
||
|
||
## 注意事项
|
||
- 操作元素前必须先 `get_page_snapshot` 获取 uid
|
||
- `navigate_to` 不能跳转 TabBar 页面，用 `switch_tab`
|
||
- `evaluate_script` 在 AppService 上下文执行，可访问 `wx`、`getApp()`、`getCurrentPages()`
|
||
- 截图默认返回 base64，传 `path` 参数可保存到文件
|