diff --git a/docs/ci/frontend-smoke-test-cases.md b/docs/ci/frontend-smoke-test-cases.md new file mode 100644 index 000000000..d84c27ed6 --- /dev/null +++ b/docs/ci/frontend-smoke-test-cases.md @@ -0,0 +1,289 @@ +# 前端冒烟测试用例清单 + +> 版本：v1.0 +> 更新日期：2026-07-13 +> 用途：CI 部署后自动化冒烟测试，验证核心业务流程可用 + +--- + +## 一、测试分级 + +| 级别 | 说明 | 必测场景 | 建议频率 | +|------|------|----------|----------| +| P0 | 阻断级：核心功能不可用则立即回滚 | 登录、首页加载、API连通性 | 每次部署 | +| P1 | 核心业务：主流程关键节点 | 生成、上传、播放、支付 | 每次部署 | +| P2 | 重要功能：常用模块 | 各列表页、设置、管理后台 | 每日/版本发布 | + +--- + +## 二、P0 级用例（部署必测） + +### 1. 首页加载 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P0-001 | +| **路径** | `/` 首页 | +| **前置条件** | 无 | +| **操作步骤** | 1. 访问首页 URL
2. 等待页面加载 | +| **预期结果** | 1. HTTP 状态码 200
2. 页面标题包含「小虾」或产品名
3. 页面有可见内容（非空白）
4. 静态资源（JS/CSS）全部加载成功，无 404/500 | +| **验证方式** | HTTP 状态码 + DOM 元素存在性检查 | +| **对应现有冒烟** | ✅ 已有（Web frontend HTTP 200） | + +### 2. 登录页可用性 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P0-002 | +| **路径** | `/login` | +| **前置条件** | 无 | +| **操作步骤** | 1. 访问登录页
2. 验证页面元素存在 | +| **预期结果** | 1. 页面正常渲染，无白屏
2. 邮箱输入框存在
3. 密码输入框存在
4. 登录按钮可见
5. 注册/忘记密码链接可点击 | +| **验证方式** | DOM 元素存在性 + 表单字段检查 | + +### 3. 登录 API 连通性 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P0-003 | +| **接口** | `POST /api/v1/auth/login` | +| **前置条件** | 无 | +| **操作步骤** | 1. 用错误账号密码调用登录接口 | +| **预期结果** | 1. 返回 HTTP 401 或 422（非 500/502/503）
2. 返回 JSON 格式响应
3. 响应包含错误信息字段 | +| **验证方式** | HTTP 状态码 + 响应格式检查 | +| **对应现有冒烟** | ✅ 已有（Login API expect 401） | + +### 4. 健康检查接口 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P0-004 | +| **接口** | `GET /health` | +| **前置条件** | 无 | +| **操作步骤** | 1. 调用健康检查接口 | +| **预期结果** | 1. HTTP 状态码 200
2. 返回包含 status 字段
3. 响应时间 < 3s | +| **验证方式** | HTTP 状态码 + 响应时间 | +| **对应现有冒烟** | ✅ 已有（Health check） | + +### 5. API 文档可访问 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P0-005 | +| **路径** | `/docs` | +| **前置条件** | 无 | +| **操作步骤** | 1. 访问 API 文档页面 | +| **预期结果** | 1. HTTP 状态码 200
2. 页面正常返回（非 500 错误页） | +| **验证方式** | HTTP 状态码检查 | +| **对应现有冒烟** | ✅ 已有（/docs endpoint） | + +--- + +## 三、P1 级用例（核心业务流程） + +### 6. 用户注册流程 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P1-001 | +| **路径** | `/register` | +| **前置条件** | 无 | +| **操作步骤** | 1. 访问注册页
2. 填写邮箱、密码、确认密码
3. 点击注册 | +| **预期结果** | 1. 注册页正常渲染
2. 表单校验生效（空值/格式错误有提示）
3. 注册成功后跳转到登录页或首页
4. 新用户可正常登录 | +| **验证方式** | 表单验证 + 页面跳转 + 登录回环 | + +### 7. Dashboard 数据加载 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P1-002 | +| **路径** | `/app/dashboard` | +| **前置条件** | 已登录 | +| **操作步骤** | 1. 登录后进入 Dashboard
2. 等待数据加载 | +| **预期结果** | 1. 页面布局正常（侧边栏 + 主内容区）
2. 统计卡片正常显示（使用量/剩余额度等）
3. 无接口 500 错误
4. 加载状态合理（loading → 内容） | +| **验证方式** | 页面布局检查 + API 响应检查 | + +### 8. 素材库页面 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P1-003 | +| **路径** | `/app/assets` | +| **前置条件** | 已登录 | +| **操作步骤** | 1. 进入素材库页面
2. 浏览列表 | +| **预期结果** | 1. 页面正常渲染，无白屏
2. 素材列表正常显示（或空状态提示）
3. 分页/筛选控件可用
4. 上传按钮可见 | +| **验证方式** | 页面渲染 + 列表数据检查 | + +### 9. 生成页面（核心功能入口） + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P1-004 | +| **路径** | `/app/generate` | +| **前置条件** | 已登录 | +| **操作步骤** | 1. 进入生成页面
2. 检查各功能模块 | +| **预期结果** | 1. 页面正常渲染
2. 生成表单各字段正常显示
3. 生成按钮可点击
4. 模板/音色等下拉选项可展开 | +| **验证方式** | 页面元素存在性 + 交互控件可用性 | + +### 10. 任务历史列表 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P1-005 | +| **路径** | `/app/history` | +| **前置条件** | 已登录 | +| **操作步骤** | 1. 进入任务历史页面 | +| **预期结果** | 1. 任务列表正常显示（或空状态）
2. 任务状态标签正确（处理中/完成/失败）
3. 分页正常 | +| **验证方式** | 列表渲染 + 状态标签检查 | + +### 11. 成品库页面 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P1-006 | +| **路径** | `/app/products` | +| **前置条件** | 已登录 | +| **操作步骤** | 1. 进入成品库页面 | +| **预期结果** | 1. 成品卡片列表正常显示
2. 视频缩略图正常加载
3. 筛选/搜索功能可用 | +| **验证方式** | 列表渲染 + 图片加载检查 | + +### 12. 订阅页面 + +| 项 | 内容 | +|----|------| +| **用例ID** | SMOKE-P1-007 | +| **路径** | `/app/subscription` | +| **前置条件** | 已登录 | +| **操作步骤** | 1. 进入订阅页面 | +| **预期结果** | 1. 套餐列表正常显示
2. 当前套餐标识正确
3. 升级/续费按钮可见 | +| **验证方式** | 页面渲染 + 套餐数据检查 | + +--- + +## 四、P2 级用例（重要功能） + +### 13. 标题库 +- **路径**：`/app/titles` +- **验证**：列表正常、筛选可用、搜索功能 + +### 14. 音色库 +- **路径**：`/app/voices` +- **验证**：音色列表、试听功能、分类筛选 + +### 15. 模板库 +- **路径**：`/app/templates` +- **验证**：模板卡片、预览功能、分类筛选 + +### 16. 我的模板 +- **路径**：`/app/my-templates` +- **验证**：用户自定义模板列表、编辑/删除操作 + +### 17. 剪辑规划师 +- **路径**：`/app/editing-planner` +- **验证**：页面渲染、功能模块正常 + +### 18. 声音克隆 +- **路径**：`/app/voice-clone` +- **验证**：页面渲染、上传入口、克隆流程入口 + +### 19. 我的音色 +- **路径**：`/app/my-voices` +- **验证**：用户音色列表、状态标签 + +### 20. 声音素材库 +- **路径**：`/app/voice-materials` +- **验证**：素材列表、上传功能 + +### 21. 个人设置 +- **路径**：`/app/profile` +- **验证**：基本信息展示、修改密码入口、账号安全设置 + +### 22. 账单页面 +- **路径**：`/app/subscription/billing` +- **验证**：账单列表、消费记录 + +### 23. 忘记密码 +- **路径**：`/forgot-password` +- **验证**：页面渲染、邮箱输入、提交功能 + +### 24. 管理后台入口 +- **路径**：`/app/admin` +- **验证**：管理员权限校验、页面正常访问或正确跳转 + +--- + +## 五、现有冒烟测试 vs 建议扩展 + +### 当前已有（4 项） +| 编号 | 测试项 | 级别 | +|------|--------|------| +| 1 | 健康检查 `/health` | P0 ✅ | +| 2 | 登录 API（expect 401） | P0 ✅ | +| 3 | API 文档 `/docs` | P0 ✅ | +| 4 | 前端页面可访问 | P0 ✅ | + +### 建议新增（首批扩展到 10 项） +| 编号 | 测试项 | 级别 | 优先级 | +|------|--------|------|--------| +| 5 | 登录页 DOM 元素检查 | P0 | 高 | +| 6 | 注册页可用性 | P1 | 高 | +| 7 | Dashboard 数据加载 | P1 | 高 | +| 8 | 生成页面可用性 | P1 | 高 | +| 9 | 素材库页面 | P1 | 中 | +| 10 | 任务历史列表 | P1 | 中 | + +### 后续扩展（第二阶段） +- 所有 P1 + P2 用例 +- 用户完整操作链路（注册 → 登录 → 生成 → 查看结果） +- 视频播放功能 +- 文件上传功能 + +--- + +## 六、自动化实现建议 + +### 方案选型 +- **轻量方案**：Playwright + 简单脚本，CI 中直接运行 +- **推荐方案**：项目已有 Playwright 配置（`playwright.config.ts` + `e2e/` 目录），直接复用 + +### CI 集成方式 +``` +staging部署完成 → 触发 E2E 冒烟测试 → 全部通过 → 标记成功 + → 有失败 → 告警 + 保留现场 +``` + +### 失败处理 +- P0 级失败：立即告警，标记部署失败，触发回滚 +- P1 级失败：告警通知，人工确认是否回滚 +- P2 级失败：记录日志，不阻断部署 + +--- + +## 七、附录：核心页面清单 + +| 页面 | 路由 | 模块 | 优先级 | +|------|------|------|--------| +| 首页 | `/` | 公共 | P0 | +| 登录 | `/login` | 认证 | P0 | +| 注册 | `/register` | 认证 | P1 | +| 忘记密码 | `/forgot-password` | 认证 | P2 | +| 重置密码 | `/reset-password` | 认证 | P2 | +| Dashboard | `/app/dashboard` | 主功能 | P1 | +| 素材库 | `/app/assets` | 资源 | P1 | +| 标题库 | `/app/titles` | 资源 | P2 | +| 音色库 | `/app/voices` | 资源 | P2 | +| 模板库 | `/app/templates` | 资源 | P2 | +| 生成页面 | `/app/generate` | 核心 | P1 | +| 任务历史 | `/app/history` | 核心 | P1 | +| 成品库 | `/app/products` | 核心 | P1 | +| 成品详情 | `/app/products/:id` | 核心 | P2 | +| 剪辑规划师 | `/app/editing-planner` | 功能 | P2 | +| 我的模板 | `/app/my-templates` | 功能 | P2 | +| 声音克隆 | `/app/voice-clone` | 功能 | P2 | +| 声音素材库 | `/app/voice-materials` | 功能 | P2 | +| 我的音色 | `/app/my-voices` | 功能 | P2 | +| 订阅计划 | `/app/subscription` | 支付 | P1 | +| 升级订阅 | `/app/subscription/upgrade` | 支付 | P2 | +| 账单 | `/app/subscription/billing` | 支付 | P2 | +| 个人设置 | `/app/profile` | 设置 | P2 | +| 管理后台 | `/app/admin` | 管理 | P2 |