forked from datawhale/whale-town-front
- 更新 auth_ui_test.tscn 中的场景引用路径 - 修复 enhanced_toast_test.gd 中的脚本路径引用 - 确保测试文件与重构后的项目结构保持一致
认证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反馈系统中的问题并进行修复。