forked from moyin/whale-town-front
moyin
47cfc14f68
- 添加UI测试场景，支持模拟各种认证场景 - 实现API测试脚本，覆盖登录、注册、验证码等接口 - 添加测试文档，说明测试用例和预期结果 - 支持自动化测试和手动测试验证
5.5 KiB
5.5 KiB
认证UI测试
这个文件夹包含了登录和注册界面的UI响应测试，具有美观优雅的反馈系统。
文件说明
auth_ui_test.tscn- 测试场景文件auth_ui_test.gd- 测试脚本README.md- 本说明文件
如何运行测试
方法1：在Godot编辑器中运行
- 在Godot编辑器中打开
tests/auth/auth_ui_test.tscn文件 - 点击编辑器右上角的"播放场景"按钮（或按F6键）
- 如果仍然跳转到主场景，请尝试以下步骤：
- 确保当前打开的是测试场景文件
- 在场景面板中右键点击根节点，选择"Change Scene"
- 或者在项目设置中临时更改主场景为测试场景
方法2：通过代码运行
在任何脚本中添加以下代码来切换到测试场景：
get_tree().change_scene_to_file("res://tests/auth/auth_ui_test.tscn")
界面布局
左侧：认证界面
- 完整的登录和注册界面
- 实时表单验证
- Toast消息显示
- 字段错误提示
右侧：测试控制面板
🧪 UI响应测试标题
📋 测试反馈面板
- 智能反馈系统：实时显示测试执行状态
- 颜色编码：
- 🔵 蓝色：信息提示
- 🟢 绿色：成功响应
- 🔴 红色：错误响应
- 详细信息：
- 测试名称和类型
- HTTP状态码
- 响应消息和错误代码
- 预期的UI反馈效果
- 自动滚动：新消息自动滚动到可见区域
🎯 测试用例按钮
16个精美设计的测试按钮，按功能分组：
测试功能
登录测试（4个）
- ✅ 登录成功（状态码200）
- 预期：绿色Toast "登录成功！正在进入鲸鱼镇..."，跳转到主场景
- ❌ 用户名或密码错误（状态码401）
- 预期：红色Toast "用户名或密码错误，请检查后重试"
- ❌ 用户不存在（状态码404）
- 预期：红色Toast "用户不存在，请先注册"
- ❌ 参数错误（状态码400）
- 预期：红色Toast，根据具体错误显示
发送验证码测试（5个）
- ✅ 发送成功（状态码200）
- 预期：绿色Toast "验证码已发送到您的邮箱"
- ❌ 邮箱格式错误（状态码400）
- 预期：红色Toast "请输入有效的邮箱地址"
- ❌ 请求过频（状态码429）
- 预期：红色Toast "请求过于频繁，请稍后再试"
- ❌ 服务器错误（状态码500）
- 预期：红色Toast "服务器繁忙，请稍后再试"
- ❌ 网络错误（状态码0）
- 预期：红色Toast "网络连接失败，请检查网络连接"
邮箱验证测试（3个）
- ✅ 验证成功（状态码200）
- 预期：绿色Toast "邮箱验证成功，正在注册..."
- ❌ 验证码错误（状态码400）
- 预期：红色Toast "验证码错误或已过期"
- ❌ 验证码不存在（状态码404）
- 预期：红色Toast "请先获取验证码"
注册测试（6个）
- ✅ 注册成功（状态码201）
- 预期：绿色Toast "注册成功！欢迎加入鲸鱼镇"，切换到登录界面
- ❌ 参数错误（状态码400）
- 预期：红色Toast，根据具体错误显示
- ❌ 缺少验证码（状态码400）
- 预期：红色Toast "请先获取并输入邮箱验证码"
- ❌ 用户已存在（状态码409）
- 预期：红色Toast "用户名或邮箱已被使用，请换一个"
- ❌ 请求过频（状态码429）
- 预期：红色Toast "注册请求过于频繁，请稍后再试"
- ❌ 服务器错误（状态码500）
- 预期：红色Toast "注册失败，请稍后再试"
测试步骤
-
启动测试场景
- 运行测试场景后，右侧反馈面板会显示欢迎信息和使用说明
-
准备测试数据
- 在左侧认证界面切换到注册界面
- 填写测试数据：
- 用户名：testuser
- 邮箱：test@example.com
- 密码：password123
- 确认密码：password123
- 验证码：123456
-
执行测试
- 点击右侧对应的测试按钮
- 观察反馈面板中的详细信息：
- 🚀 测试开始提示
- 📡 请求类型和状态码
- ⚡ HTTP响应模拟
- 🎯 预期UI反馈说明
- ✅/❌ 测试完成状态
-
观察UI反馈
- 左侧界面的实际反馈效果
- Toast消息的颜色和内容
- 字段错误提示的显示
- 按钮状态的变化
反馈系统特色
🎨 美观设计
- 使用Emoji图标增强视觉效果
- 颜色编码区分不同状态
- 圆角边框和阴影效果
- 按钮分组和分隔符
📊 详细分析
- 实时显示测试执行过程
- 预期vs实际效果对比
- HTTP响应详细解析
- 错误代码和消息说明
🔄 交互体验
- 自动滚动到最新消息
- 按钮悬停效果
- 平滑的颜色过渡
- 响应式布局
注意事项
- 测试场景会自动断开
login_success信号，避免跳转到主场景 - 按ESC键可以优雅退出测试（显示退出提示）
- 所有测试都是模拟的，不会发送真实的网络请求
- 反馈面板会保留测试历史，便于对比分析
- 测试按钮按功能分组，每组之间有分隔符
预期行为验证
这个测试系统不仅模拟后端响应，还会告诉你每种情况下应该看到什么UI反馈，帮助你验证：
- Toast消息系统是否正常工作
- 字段验证错误是否正确显示
- 按钮状态管理是否符合预期
- 用户体验流程是否顺畅
通过对比预期效果和实际效果，可以快速发现UI反馈系统中的问题并进行修复。