forked from moyin/whale-town-front
新的目录结构: 01-项目入门/ # 新人必读,项目基础 02-开发规范/ # 编码标准和规范 03-技术实现/ # 具体开发指导 04-高级开发/ # 进阶开发技巧 05-部署运维/ # 发布和部署 06-功能模块/ # 特定功能文档 新增导航文档: - docs/README.md - 完整的文档导航和使用指南 - 各目录下的README.md - 分类说明和使用指导 优化效果: - 开发者可以按阶段快速定位需要的文档 - 新人有清晰的学习路径 - 不同角色有针对性的文档推荐 - 提供了问题导向的快速查找功能
7.2 KiB
7.2 KiB
表单验证测试指南
测试概述
本文档提供了完整的表单验证功能测试步骤,确保所有验证规则和用户交互都能正常工作。
测试环境准备
1. 启动后端服务
# 确保后端服务运行在 https://whaletownend.xinghangee.icu
# 或者本地开发环境: http://localhost:3000
npm start
# 或者你的后端启动命令
2. 打开Godot项目
- 启动Godot编辑器
- 打开鲸鱼镇项目
- 运行主场景
登录表单测试
测试用例1: 必填项验证
步骤
- 点击"注册居民身份"进入登录界面
- 不输入任何内容,直接点击用户名输入框外的区域
- 不输入任何内容,直接点击密码输入框外的区域
- 点击"进入小镇"或"密码登录"按钮
预期结果
- 用户名输入框下方显示红色错误提示:"用户名不能为空"
- 密码输入框下方显示红色错误提示:"密码不能为空"
- 按钮点击无效,不会提交表单
测试用例2: 实时反馈
步骤
- 触发上述错误提示后
- 在用户名输入框中输入任意字符
- 在密码输入框中输入任意字符
预期结果
- 开始输入时,对应的错误提示立即消失
- 提供即时的视觉反馈
测试用例3: 正常登录
步骤
- 输入有效的用户名:"testuser"
- 输入任意密码:"password123"
- 点击"进入小镇"
预期结果
- 无错误提示显示
- 成功进入游戏主界面
- 显示用户名信息
注册表单测试
测试用例4: 用户名验证
测试数据
| 输入 | 预期结果 | 错误信息 |
|---|---|---|
| (空) | 失败 | "用户名不能为空" |
| "test@user" | 失败 | "用户名只能包含字母、数字和下划线" |
| "a".repeat(51) | 失败 | "用户名长度应为1-50字符" |
| "test_user123" | 成功 | 无错误提示 |
步骤
- 点击"注册居民身份"
- 依次输入上述测试数据
- 每次输入后点击其他输入框(触发失焦验证)
测试用例5: 邮箱验证
测试数据
| 输入 | 预期结果 | 错误信息 |
|---|---|---|
| (空) | 失败 | "邮箱不能为空" |
| "invalid-email" | 失败 | "请输入有效的邮箱地址" |
| "test@" | 失败 | "请输入有效的邮箱地址" |
| "test@example.com" | 成功 | 无错误提示 |
步骤
- 在邮箱输入框中依次输入测试数据
- 每次输入后点击其他输入框
测试用例6: 密码验证
测试数据
| 输入 | 预期结果 | 错误信息 |
|---|---|---|
| (空) | 失败 | "密码不能为空" |
| "1234567" | 失败 | "密码长度至少8位" |
| "12345678" | 失败 | "密码必须包含字母和数字" |
| "abcdefgh" | 失败 | "密码必须包含字母和数字" |
| "abc12345" | 成功 | 无错误提示 |
步骤
- 在密码输入框中依次输入测试数据
- 每次输入后点击其他输入框
测试用例7: 确认密码验证
步骤
- 在密码框输入:"abc12345"
- 在确认密码框输入:""(空)
- 点击其他输入框
- 在确认密码框输入:"different123"
- 点击其他输入框
- 在确认密码框输入:"abc12345"
- 点击其他输入框
预期结果
- 步骤3: 显示"确认密码不能为空"
- 步骤5: 显示"两次输入的密码不一致"
- 步骤7: 无错误提示
测试用例8: 验证码功能
步骤
- 不输入邮箱,直接点击"发送验证码"
- 输入无效邮箱"invalid",点击"发送验证码"
- 输入有效邮箱"test@example.com",点击"发送验证码"
- 立即再次点击"发送验证码"
- 在验证码输入框输入"12345"(5位)
- 在验证码输入框输入"12345a"(包含字母)
- 在验证码输入框输入"123456"(正确格式)
预期结果
- 步骤1: 邮箱框显示"邮箱不能为空",聚焦到邮箱输入框
- 步骤2: 邮箱框显示"请输入有效的邮箱地址"
- 步骤3: 显示"正在发送验证码...",按钮变为禁用状态
- 步骤4: 显示冷却提示"请等待 XX 秒后再次发送"
- 步骤5: 验证码框显示"验证码必须是6位数字"
- 步骤6: 验证码框显示"验证码必须是6位数字"
- 步骤7: 无错误提示
测试用例9: 完整注册流程
步骤
- 填写所有必填信息:
- 用户名: "testuser"
- 邮箱: "test@example.com"
- 密码: "password123"
- 确认密码: "password123"
- 点击"发送验证码"
- 查看控制台获取验证码
- 输入验证码
- 点击"注册"按钮
预期结果
- 所有验证通过,无错误提示
- 显示"正在验证邮箱..."
- 显示"邮箱验证成功,正在注册..."
- 显示"注册成功!"
- 自动返回登录界面
- 用户名自动填入登录表单
边界情况测试
测试用例10: 网络异常
步骤
- 关闭后端服务
- 尝试发送验证码
- 尝试注册
预期结果
- 显示"网络连接失败,请检查服务器是否启动"
- 按钮重新启用
测试用例11: 快速操作
步骤
- 快速连续点击"发送验证码"按钮
- 快速连续点击"注册"按钮
预期结果
- 按钮在请求期间被禁用
- 防止重复提交
测试用例12: 表单切换
步骤
- 在注册表单中输入信息并触发错误提示
- 点击"返回登录"
- 再次点击"注册居民身份"
预期结果
- 切换到登录界面时,注册表单状态保持
- 再次进入注册界面时,表单被清空,错误提示被隐藏
性能测试
测试用例13: 响应速度
步骤
- 快速在各个输入框之间切换
- 快速输入和删除文本
- 观察错误提示的显示和隐藏速度
预期结果
- 验证响应迅速,无明显延迟
- UI更新流畅,无卡顿现象
兼容性测试
测试用例14: 不同输入法
步骤
- 使用中文输入法输入用户名
- 使用英文输入法输入用户名
- 输入特殊字符
预期结果
- 中文字符被正确验证为无效格式
- 英文字符正常通过验证
- 特殊字符按规则验证
测试检查清单
功能完整性
- 所有必填项都有红色星号标识
- 失焦验证正常工作
- 实时输入反馈正常
- 错误提示准确显示
- 验证码发送和验证功能正常
- 注册流程完整可用
用户体验
- 错误提示清晰易懂
- 按钮状态管理正确
- 表单切换流畅
- 成功反馈及时
错误处理
- 网络异常处理正确
- 服务器错误处理正确
- 边界情况处理正确
性能表现
- 验证响应速度快
- UI更新流畅
- 内存使用正常
测试报告模板
测试环境
- Godot版本:
- 操作系统:
- 后端服务状态:
- 测试时间:
测试结果
| 测试用例 | 状态 | 备注 |
|---|---|---|
| 登录表单验证 | ✅/❌ | |
| 注册表单验证 | ✅/❌ | |
| 验证码功能 | ✅/❌ | |
| 网络异常处理 | ✅/❌ | |
| 完整注册流程 | ✅/❌ |
发现的问题
- 问题描述
- 重现步骤
- 预期结果
- 实际结果
- 严重程度
改进建议
- 功能改进
- 用户体验优化
- 性能优化
测试完成日期: ___________
测试人员: ___________
测试版本: v1.0.0