#使用 Skills 控制任意平台

Agent Skills 是一种扩展 AI 编程助手能力的格式。Midscene 提供了 Agent Skills，让 AI 编程工具（如 Claude Code、Cline 等）可以通过 CLI 命令驱动 UI 自动化。

Skills 通过在终端中直接运行 CLI 命令来工作。AI 编程助手充当“大脑”：截图、分析 UI、决定下一步操作。

#支持的平台

在默认 Puppeteer 模式下，可以通过 --viewport-width <width> 和 --viewport-height <height> 覆盖默认的 1440x800 视口尺寸。这两个参数仅支持默认 Puppeteer 模式，不支持 --bridge 或 --cdp 模式。

在 CDP 模式下，每个 HTTP header 使用一个独立的 --extra-http-header 'Name:Value' 参数。每条 CLI 命令都会创建新的 CDP session，因此所有可能发起请求的独立命令都必须重复携带这些参数：

npx @midscene/web connect \
  --cdp ws://127.0.0.1:9222/devtools/browser \
  --extra-http-header 'x-use-ppe:1' \
  --extra-http-header 'x-tt-env:ppe_example' \
  --url https://example.com

npx @midscene/web act \
  --cdp ws://127.0.0.1:9222/devtools/browser \
  --extra-http-header 'x-use-ppe:1' \
  --extra-http-header 'x-tt-env:ppe_example' \
  --prompt "click the button"

header 会在 connect --url 导航前生效，因此初始文档请求也会携带这些 header。不要把敏感鉴权值直接留在 shell 历史中。

如果 Chrome 安装在非标准路径，请将 MIDSCENE_CHROME_PATH 设置为 Chrome 可执行文件路径。MIDSCENE_MCP_CHROME_PATH 会暂时作为迁移别名继续生效。

#安装

确保已安装 Node.js，然后运行：

# 通用安装
npx skills add web-infra-dev/midscene-skills

# Claude Code
npx skills add web-infra-dev/midscene-skills -a claude-code

# OpenClaw
npx skills add web-infra-dev/midscene-skills -a openclaw

Skills 仓库：github.com/web-infra-dev/midscene-skills

#模型配置

Midscene Skills 需要具备极强 UI 定位能力的多模态模型。请配置以下环境变量。你可以把它们设为系统环境变量，也可以写在当前工作目录的 .env 文件中（Midscene 会自动加载 .env）。

MIDSCENE_MODEL_API_KEY="your-api-key"
MIDSCENE_MODEL_NAME="model-name"
MIDSCENE_MODEL_BASE_URL="https://..."
MIDSCENE_MODEL_FAMILY="family-identifier"

支持的模型和配置详情请参考 模型策略 和 常用模型配置。

#使用 Skills

安装完成后，只需用自然语言把任务描述给你的 AI 编程助手即可。它会自动选择合适的 Skill、运行 CLI、读取截图并决定下一步。例如：

打开相册应用，看看相册里的第一张照片是什么。

#案例：编码 Agent 写完代码后自行验证功能

以下示例中，我们让 Claude Code 开发一个 Electron Todo 应用。写完代码后，它会通过 desktop-computer-automation Skill 自行启动应用、操作 UI、截图验证功能是否符合预期。全程无需人工介入，也无需编写测试脚本。

Prompt：

开发一个 Electron Todo 应用，包含添加、勾选、删除功能。
开发完成后，启动应用并用桌面自动化验证：添加 3 个 todo、勾选其中 1 个、删除 1 个，截图确认最终状态正确。

编码 Agent 会自主完成以下工作：编写 Todo 组件 → 启动 Electron 应用 → 连接桌面 → 截图识别 UI → 通过自然语言操作界面 → 截图验证结果。开发者只需描述意图，Skill 赋予 Agent “看屏幕、动鼠标”的能力，让它像人一样验证自己写的代码。

#更多应用场景

Skills 不仅限于本地桌面测试，通过组合不同 Skill 可以覆盖更多场景：

• 桌面应用自动化测试：验证 Electron、Qt、WPF 等桌面应用的功能流程
• 远程控制电脑：通过远程桌面连接操控远程机器上的应用，实现远程运维和调试
• 移动端应用测试：使用 @midscene/android 和 @midscene/ios Skill 在真机或模拟器上验证移动应用
• 跨应用工作流：串联多个应用操作，如从浏览器取数据 → 粘贴到 Excel → 截图发送到 Slack
• CI/CD 集成：在 Linux CI 中通过 Xvfb 无头模式运行，无需物理显示器
• 日常任务自动化：批量填写表单、定时截图监控、自动整理文件等

#更多

请参考 Skills 仓库 获取更多详情。