cd d:\work\project\my\drawThingsWebUI
python -m src.app打开浏览器访问：http://127.0.0.1:5000/history.html
- 打开主页：
http://127.0.0.1:5000/ - 输入提示词（例如："a beautiful landscape"）
- 点击"生成图片"按钮
- 立即切换到历史记录页面（或在新标签页打开）
- 应该看到最新的一条记录显示：
- ✨ 闪烁的渐变背景
- 🔄 旋转的加载圆圈
- 📝 "生成中..." 文字提示
- 等待 3-5 秒
- 页面会自动刷新
- 加载动画应该被实际图片替换
✅ 成功标志：
- 加载动画清晰可见
- 动画流畅无卡顿
- 自动生成完成后自动显示图片
- 无需手动刷新页面
❌ 失败标志：
- 看到空白区域
- 图片破损图标
- 需要手动刷新才能看到图片
┌─────────────────────┐
│ │
│ ~~~ shimmer ~~~ │ ← 渐变背景流动
│ ⟳ │ ← 旋转的spinner
│ 生成中... │ ← 状态文本
│ │
└─────────────────────┘
提示词: a beautiful landscape
512x512 Seed: -
┌─────────────────────┐
│ │
│ [实际图片] │ ← 显示生成的图片
│ │
│ │
└─────────────────────┘
提示词: a beautiful landscape
512x512 Seed: 12345
⭐⭐⭐ 30.5s
-- 查看最近的记录
SELECT id, image_id, elapsed_time, created_at
FROM generation_history
ORDER BY created_at DESC
LIMIT 5;应该看到：
- 正在生成的记录：
elapsed_time = 0 - 已完成的记录：
elapsed_time > 0
打开浏览器开发者工具（F12），观察：
- Network 标签：每3秒有一次
/api/history请求（当有生成中的项目时） - Console 标签：没有错误信息
在开发者工具的 Elements 标签中：
- 选中
.history-item-loading元素 - 在 Styles 面板中确认动画属性存在
- 在 Computed 面板中确认动画正在运行
- 同时发起 3-5 个图片生成任务
- 打开历史记录页面
- 应该看到多个加载动画同时显示
- 每个任务完成后独立更新
- 保持历史记录页面打开 5-10 分钟
- 期间不定期生成新图片
- 检查页面是否仍然响应
- 检查内存使用是否正常
- 清空所有历史记录
- 页面应显示"暂无历史记录"
- 不应有加载动画
- 等待所有图片生成完成
- 自动刷新应停止
- 不再发送额外的 API 请求
- 在生成过程中切换到其他页面
- 返回历史记录页面
- 应正常显示当前状态
- 在生成过程中断开网络
- 应显示错误提示
- 重新连接后应恢复正常
可能原因：
- 图片生成太快，来不及观察
- 浏览器缓存了旧版本
解决方案：
- 使用更大的图片尺寸（如 1024x1024）和更多步数（如 20）
- 强制刷新页面（Ctrl+F5）
- 清除浏览器缓存
可能原因：
- 浏览器性能问题
- CSS 动画不支持
解决方案：
- 尝试不同的浏览器
- 检查浏览器是否启用了硬件加速
可能原因：
elapsed_time判断逻辑有误
解决方案：
- 检查控制台是否有 JavaScript 错误
- 验证数据库中
elapsed_time是否正确更新
- 主页图片生成功能正常
- 历史记录列表显示正常
- 日期筛选功能正常
- 星级评分功能正常
- NSFW 标记功能正常
- 删除 Bad 图片功能正常
- 查看所有用户功能正常
- 返回顶部按钮正常
- 提示词复制功能正常
- Seed 复制功能正常