admin/realizemultiagent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
main
realizemultiagent/roles/qa/test-cases-TASK-20260331-001.md
renjianbo 881cca3fe6 sec commit
2026-04-02 00:59:42 +08:00

12 KiB
Raw Permalink Blame History

测试用例详情：个人作品展示网站

任务ID: TASK-20260331-001

测试用例分类

A. 导航功能测试用例

A1. 桌面端导航

用例ID: NAV-DESKTOP-001 测试目标: 验证桌面端导航菜单功能 前置条件: 浏览器窗口宽度 ≥ 1024px 测试步骤:

  1. 访问网站首页
  2. 观察导航栏显示
  3. 点击每个导航链接（首页、关于、技能、项目、联系）
  4. 验证页面是否滚动到对应部分
  5. 验证活动导航项高亮显示 预期结果:
  • 导航栏固定显示在顶部
  • 点击链接平滑滚动到对应部分
  • 活动导航项有视觉高亮 实际结果: [待测试] 状态: 待执行

A2. 移动端菜单切换

用例ID: NAV-MOBILE-001 测试目标: 验证移动端汉堡菜单功能 前置条件: 浏览器窗口宽度 ≤ 1023px 测试步骤:

  1. 调整浏览器窗口宽度至1023px或以下
  2. 观察导航栏显示汉堡菜单图标
  3. 点击汉堡菜单图标
  4. 验证导航链接菜单展开
  5. 再次点击汉堡菜单图标
  6. 验证导航链接菜单收起
  7. 点击导航链接
  8. 验证菜单自动收起并滚动到对应部分 预期结果:
  • 移动端显示汉堡菜单图标
  • 点击图标切换菜单显示/隐藏
  • 点击链接后菜单自动收起 实际结果: [待测试] 状态: 待执行

A3. 滚动导航高亮

用例ID: NAV-SCROLL-001 测试目标: 验证滚动时导航高亮更新 测试步骤:

  1. 访问网站首页
  2. 手动滚动页面
  3. 观察导航栏高亮项变化
  4. 滚动到每个部分验证对应导航项高亮 预期结果:
  • 滚动时导航高亮实时更新
  • 每个部分对应正确的导航项高亮 实际结果: [待测试] 状态: 待执行

B. 表单功能测试用例

B1. 表单验证 - 有效数据

用例ID: FORM-VALID-001 测试目标: 验证表单接受有效数据 测试数据:

  • 姓名: 测试用户
  • 邮箱: test@example.com
  • 主题: 测试咨询
  • 消息: 这是一条测试消息，用于验证表单功能是否正常工作。 测试步骤:
  1. 滚动到联系部分
  2. 输入测试数据
  3. 点击"发送消息"按钮
  4. 观察表单行为 预期结果:
  • 表单验证通过
  • 显示"发送中..."状态
  • 1.5秒后显示成功消息
  • 表单内容清空
  • 按钮恢复原始状态 实际结果: [待测试] 状态: 待执行

B2. 表单验证 - 无效姓名

用例ID: FORM-INVALID-NAME-001 测试目标: 验证姓名字段验证 测试数据:

  • 姓名: A
  • 邮箱: test@example.com
  • 主题: 测试
  • 消息: 测试消息 测试步骤:
  1. 输入测试数据
  2. 点击"发送消息"按钮
  3. 观察错误消息 预期结果:
  • 显示错误消息:"请输入有效的姓名（至少2个字符）"
  • 表单不提交 实际结果: [待测试] 状态: 待执行

B3. 表单验证 - 无效邮箱

用例ID: FORM-INVALID-EMAIL-001 测试目标: 验证邮箱字段验证 测试数据:

  • 姓名: 测试用户
  • 邮箱: invalid-email
  • 主题: 测试
  • 消息: 测试消息 测试步骤:
  1. 输入测试数据
  2. 点击"发送消息"按钮
  3. 观察错误消息 预期结果:
  • 显示错误消息:"请输入有效的邮箱地址"
  • 表单不提交 实际结果: [待测试] 状态: 待执行

B4. 表单验证 - 无效主题

用例ID: FORM-INVALID-SUBJECT-001 测试目标: 验证主题字段验证 测试数据:

  • 姓名: 测试用户
  • 邮箱: test@example.com
  • 主题: 测
  • 消息: 测试消息 测试步骤:
  1. 输入测试数据
  2. 点击"发送消息"按钮
  3. 观察错误消息 预期结果:
  • 显示错误消息:"请输入主题（至少3个字符）"
  • 表单不提交 实际结果: [待测试] 状态: 待执行

B5. 表单验证 - 无效消息

用例ID: FORM-INVALID-MESSAGE-001 测试目标: 验证消息字段验证 测试数据:

  • 姓名: 测试用户
  • 邮箱: test@example.com
  • 主题: 测试主题
  • 消息: 短 测试步骤:
  1. 输入测试数据
  2. 点击"发送消息"按钮
  3. 观察错误消息 预期结果:
  • 显示错误消息:"请输入消息内容（至少10个字符）"
  • 表单不提交 实际结果: [待测试] 状态: 待执行

C. 交互功能测试用例

C1. 返回顶部按钮

用例ID: INTERACTION-BACKTOTOP-001 测试目标: 验证返回顶部按钮功能 测试步骤:

  1. 滚动页面超过300px
  2. 观察右下角返回顶部按钮显示
  3. 点击返回顶部按钮
  4. 验证页面平滑滚动到顶部
  5. 验证按钮隐藏 预期结果:
  • 滚动超过300px时按钮显示
  • 点击按钮返回顶部
  • 滚动到顶部时按钮隐藏 实际结果: [待测试] 状态: 待执行

C2. 技能条动画

用例ID: INTERACTION-SKILLS-001 测试目标: 验证技能条动画触发 测试步骤:

  1. 刷新页面
  2. 直接滚动到技能部分
  3. 观察技能条动画
  4. 刷新页面后缓慢滚动，让技能部分自然进入视口
  5. 再次观察技能条动画 预期结果:
  • 技能部分进入视口时触发动画
  • 技能条从0%宽度动画到目标百分比 实际结果: [待测试] 状态: 待执行

C3. 项目卡片交互

用例ID: INTERACTION-PROJECTS-001 测试目标: 验证项目卡片交互 测试步骤:

  1. 鼠标悬停在项目卡片上
  2. 观察悬停效果
  3. 点击项目卡片（非链接区域）
  4. 查看控制台输出
  5. 使用Tab键聚焦项目卡片
  6. 按Enter键
  7. 再次查看控制台输出 预期结果:
  • 鼠标悬停时有上浮效果
  • 点击卡片在控制台输出项目名称
  • 键盘导航支持Enter键触发 实际结果: [待测试] 状态: 待执行

D. 响应式设计测试用例

D1. 桌面端布局 (≥1200px)

用例ID: RESPONSIVE-DESKTOP-001 测试目标: 验证桌面端布局 测试步骤:

  1. 设置浏览器宽度 ≥ 1200px
  2. 验证以下布局:
    • Hero部分: 两列布局
    • 关于部分: 两列布局
    • 技能部分: 三列布局
    • 项目部分: 三列布局
    • 联系部分: 两列布局
  3. 验证导航栏显示完整菜单 预期结果:
  • 所有部分使用多列布局
  • 导航显示完整菜单项 实际结果: [待测试] 状态: 待执行

D2. 平板端布局 (768px-1023px)

用例ID: RESPONSIVE-TABLET-001 测试目标: 验证平板端布局 测试步骤:

  1. 设置浏览器宽度 768px-1023px
  2. 验证以下变化:
    • 显示汉堡菜单图标
    • 技能部分: 两列布局
    • 项目部分: 两列布局
    • Hero部分: 单列布局，图片在上
    • 关于部分: 单列布局
    • 联系部分: 单列布局
  3. 测试汉堡菜单功能 预期结果:
  • 布局适应平板尺寸
  • 汉堡菜单功能正常 实际结果: [待测试] 状态: 待执行

D3. 移动端布局 (576px-767px)

用例ID: RESPONSIVE-MOBILE-001 测试目标: 验证移动端布局 测试步骤:

  1. 设置浏览器宽度 576px-767px
  2. 验证以下变化:
    • 技能部分: 单列布局
    • 项目部分: 单列布局
    • 按钮: 全宽显示
    • 经验部分: 单列布局
  3. 测试触摸目标大小 预期结果:
  • 所有部分单列布局
  • 触摸目标大小合适 实际结果: [待测试] 状态: 待执行

D4. 小屏幕布局 (≤575px)

用例ID: RESPONSIVE-SMALL-001 测试目标: 验证小屏幕布局 测试步骤:

  1. 设置浏览器宽度 ≤ 575px
  2. 验证以下变化:
    • 字体大小适当缩小
    • 图片尺寸适当缩小
    • 间距适当调整
    • 联系信息垂直排列
  3. 测试所有交互元素 预期结果:
  • 布局在小屏幕上仍然可用
  • 所有功能正常工作 实际结果: [待测试] 状态: 待执行

E. 可访问性测试用例

E1. 键盘导航

用例ID: ACCESSIBILITY-KEYBOARD-001 测试目标: 验证键盘导航支持 测试步骤:

  1. 使用Tab键浏览页面
  2. 验证焦点顺序:
    • 导航链接
    • Hero部分按钮
    • 项目卡片
    • 表单字段
    • 社交链接
    • 页脚链接
  3. 使用Enter键激活焦点元素
  4. 使用空格键激活项目卡片 预期结果:
  • 合理的焦点顺序
  • 所有交互元素可通过键盘访问
  • 焦点状态有视觉指示 实际结果: [待测试] 状态: 待执行

E2. 屏幕阅读器兼容性

用例ID: ACCESSIBILITY-SCREENREADER-001 测试目标: 验证屏幕阅读器支持 测试步骤:

  1. 使用屏幕阅读器（或模拟）
  2. 导航整个页面
  3. 验证以下内容:
    • 页面标题和结构
    • 导航菜单描述
    • 表单字段标签
    • 图片替代文本
    • 按钮和链接描述 预期结果:
  • 屏幕阅读器能正确读取页面结构
  • 所有交互元素有适当描述 实际结果: [待测试] 状态: 待执行

F. 性能测试用例

F1. 页面加载性能

用例ID: PERFORMANCE-LOAD-001 测试目标: 验证页面加载性能 测试步骤:

  1. 清除浏览器缓存
  2. 打开浏览器开发者工具网络面板
  3. 访问网站
  4. 记录以下指标:
    • DOMContentLoaded时间
    • Load时间
    • 资源数量
    • 总传输大小
  5. 使用Lighthouse运行性能测试 预期结果:
  • 首次加载时间 < 3秒
  • Lighthouse性能评分 ≥ 80
  • 资源优化良好 实际结果: [待测试] 状态: 待执行

F2. 滚动性能

用例ID: PERFORMANCE-SCROLL-001 测试目标: 验证滚动性能 测试步骤:

  1. 快速滚动页面
  2. 观察帧率（使用开发者工具）
  3. 测试技能条动画性能
  4. 测试项目卡片悬停动画性能 预期结果:
  • 滚动流畅，帧率稳定
  • 动画性能良好，无卡顿 实际结果: [待测试] 状态: 待执行

测试数据准备

有效测试数据

{
  "validForm": {
    "name": "测试用户",
    "email": "test@example.com",
    "subject": "项目合作咨询",
    "message": "您好，我对您的项目经验很感兴趣，希望有机会合作。请回复此邮件进一步沟通。"
  }
}

无效测试数据

{
  "invalidName": {
    "name": "A",
    "email": "test@example.com",
    "subject": "测试",
    "message": "测试消息"
  },
  "invalidEmail": {
    "name": "测试用户",
    "email": "invalid-email",
    "subject": "测试",
    "message": "测试消息"
  },
  "invalidSubject": {
    "name": "测试用户",
    "email": "test@example.com",
    "subject": "测",
    "message": "测试消息"
  },
  "invalidMessage": {
    "name": "测试用户",
    "email": "test@example.com",
    "subject": "测试主题",
    "message": "短"
  }
}

测试环境要求

浏览器要求

  • Chrome 最新版本
  • Firefox 最新版本
  • Safari 最新版本
  • Edge 最新版本

设备要求

  • 桌面电脑（测试桌面布局）
  • 平板设备或模拟器（测试平板布局）
  • 手机设备或模拟器（测试移动布局）

工具要求

  • 浏览器开发者工具
  • Lighthouse 性能测试工具
  • 颜色对比度检查工具
  • 屏幕阅读器（或模拟器）

测试执行说明

测试优先级

  1. P0（关键）: 导航功能、表单提交、基本布局
  2. P1（重要）: 响应式设计、交互功能、可访问性
  3. P2（一般）: 性能优化、边缘情况、浏览器兼容性

测试记录要求

  1. 每个测试用例执行时截图
  2. 记录实际结果与预期结果的差异
  3. 发现缺陷时记录详细复现步骤
  4. 记录测试环境信息（浏览器版本、设备型号等）

缺陷报告格式

缺陷ID: [自动生成]
标题: [简明描述问题]
严重程度: [Critical/High/Medium/Low]
优先级: [P0/P1/P2/P3]
模块: [导航/表单/布局/性能等]
测试环境: [浏览器、设备、操作系统]
复现步骤:
1. [步骤1]
2. [步骤2]
3. [步骤3]
预期结果: [应该发生什么]
实际结果: [实际发生什么]
截图/日志: [附件]
备注: [其他信息]

文档版本: 1.0 创建日期: 2026-03-31 更新日期: 2026-03-31 创建人: QA

Reference in New Issue View Git Blame Copy Permalink