uniapp-test:把 uni-app 页面测试写成可执行工作流

前言

uni-app 与 uni-app x 项目往往同时维护 .vue / .uvue 页面和 pages/ 下的路由结构,端到端测试还要区分 Web、App、鸿蒙与微信小程序等多端脚本。手写 *.test.js、对照页面改选择器、再分别执行 npm run test:*,很容易在「补用例—跑平台—修失败」之间来回切换。下面介绍 SkillHub 上的 uniapp-test,它把「读页面结构 → 生成或补测试 → 跑指定端 → 修到通过」整理成 Agent 可遵循的一套工作流,而不是单次问答里的零散建议。

这是什么

uniapp-test(坐标 @user_3141f90e/uniapp-test,版本 1.0.0)是社区来源(community)的 Agent Skill,分类为 dev-programming,由发布者 user_3141f90e 维护,SkillHub 页面标注 requires_api_key=false,无需额外 API Key。

一句话定位:面向 uni-app / uni-app x 的自动化测试工程师工作流 Skill——分析 .uvue 或 .vue 页面,生成或完善同名 *.test.js,在 Web / Android / iOS / 鸿蒙 / 微信小程序上运行测试,并在失败时协助改写到通过。

官方入口:

  • API / 安装线索:https://api.skillhub.cn/user_3141f90e/uniapp-test
  • SkillHub 展示页:https://www.skillhub.cn/skills/user_3141f90e/uniapp-test

(SkillHub 当前展示:评分 100000,下载 2382 次。)

核心功能

以下能力均来自官方简介与 SkillHub 页面说明,未单独展开实现细节的部分不臆测。

  1. 页面结构分析
    针对项目中的 .uvue、.vue 以及 pages/ 目录下的页面,为后续测试用例提供结构依据。

  2. 测试用例生成与完善
    产出或补全与页面对应的 *.test.js,覆盖常见 uni 自动化 API 场景(简介中提到的如 program.reLaunch、page.$、page.waitFor 等)。

  3. 多端执行
    工作流与项目中已有的 npm 测试脚本对齐,包括但不限于:
    - npm run test:web
    - npm run test:app-android
    - npm run test:app-ios
    - npm run test:app-harmony
    - npm run test:mp-weixin

  4. 失败修复闭环
    运行失败后继续在同一 Skill 指导下改用例,直到通过。

  5. 触发范围较宽
    用户提到 uni-app、uniapp、uni-app x、uvue、uni 自动化测试、pages/ 页面测试、*.test.js,或表达「为某页写测试 / 跑测试 / 修测试」时,即应启用本 Skill,即便未明说「自动化测试」四字。

安装与启用

SkillHub 官方建议:先按 SkillHub 安装说明 配置 CLI,再将本 Skill 安装到当前 Agent 实际读取的 skills 目录(装错目录会导致 Agent 识别不到)。

1、检查或安装 skillhub CLI

command -v skillhub && skillhub --version

若未安装,可使用官方完整安装脚本(文档标注沙箱环境需具备联网权限):

curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash

仅需 CLI 时:

curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash -s -- --cli-only

2、安装 uniapp-test

安装时必须用 --dir 指向当前环境的 skills 目录。SkillHub 文档给出的常见路径示例:

环境 skills 目录(示例)
Cursor ~/.cursor/skills/
Claude Code ~/.claude/skills/
Codex ~/.codex/skills/ 或项目下 .agents/skills/

以 Cursor 为例:

skillhub install @user_3141f90e/uniapp-test --dir ~/.cursor/skills/

也可将安装提示直接交给 Agent:「请根据 https://skillhub.cn/install/skillhub.md,安装 @user_3141f90e/uniapp-test。」

安装后按所用客户端要求重启或刷新 Agent,使 Skill 生效。

典型用法

公开页面未提供独立的长示例仓库;可复现的用法是在已具备 uni 自动化测试基建的项目里,用自然语言驱动上述工作流。

  1. 为单个页面补测试
    指明 pages/ 下页面路径或 .vue / .uvue 文件,要求生成或完善对应的 *.test.js。

  2. 按端运行
    说明目标平台,让 Agent 选择匹配的脚本,例如 Web 端:

   npm run test:web

App Android:

   npm run test:app-android

其他端同理使用 test:app-ios、test:app-harmony、test:mp-weixin。

  1. 失败后的修复
    粘贴失败日志或说明断言/等待超时,要求基于 page.$、page.waitFor、program.reLaunch 等 API 调整用例并重复执行,直到通过。

经过上面的步骤,Skill 的价值在于把「写用例、选命令、改选择器」绑在同一条对话工作流里,而不是只生成一段无法与项目脚本对齐的示例代码。

适用场景与注意

适合谁

  • 已在 uni-app / uni-app x 工程中使用 *.test.js 与 npm run test:* 的团队或个人。
  • 需要跨 Web、原生 App、鸿蒙、微信小程序多端回归,但希望由 Agent 承担页面分析与用例迭代的人。

限制与注意

  • 本 Skill 不替代本地测试环境:各端仍依赖项目自身的测试框架、模拟器/真机与依赖安装;Skill 指导的是工作流与用例内容。
  • 安装目录必须与当前 Agent 一致;官方文档强调默认装到 ./skills/ 时 many Agent 不会自动加载。
  • 公开 SkillHub 页未附带完整 SKILL.md 正文镜像,具体步骤细则以安装到本地的 Skill 文件为准。
  • 评分与下载量来自 SkillHub 展示,会随时间变化,引用时以官网为准。

结尾

uniapp-test 把 uni-app 多端页面测试收敛为「分析页面 → 维护 *.test.js → 跑对应 npm run test:* → 修失败」的 Agent 工作流,适合在已有测试脚本的项目里减轻手工编排成本。需要安装或更新时,请使用坐标 @user_3141f90e/uniapp-test,并参考 https://www.skillhub.cn/skills/user_3141f90e/uniapp-test 与 https://api.skillhub.cn/user_3141f90e/uniapp-test。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

Xiaoye