# 阶段1: Logger系统测试指南

## ✅ 已完成的工作

1. ✅ 添加了 `src/utils/logger.js` - 专业日志系统
2. ✅ 修改了 `src/stores/tokenStore.js` - 集成logger系统
3. ✅ 批量替换了139处日志调用

---

## 🧪 测试步骤

### 1. 启动开发服务器

```bash
npm run dev
```

### 2. 打开浏览器控制台

打开Chrome DevTools（F12），切换到Console标签

### 3. 测试日志级别控制

在控制台输入以下命令测试：

#### 测试1: 静默模式（只显示警告和错误）
```javascript
wsDebug.quiet()
```
**预期结果**: 控制台消息会少很多，只显示WARNING和ERROR级别

#### 测试2: 正常模式（显示信息级别）
```javascript
wsDebug.normal()
```
**预期结果**: 显示INFO、WARN、ERROR级别的日志

#### 测试3: 调试模式（显示所有调试信息）
```javascript
wsDebug.debug()
```
**预期结果**: 显示DEBUG、INFO、WARN、ERROR级别的日志

#### 测试4: 详细模式（显示所有日志）
```javascript
wsDebug.verbose()
```
**预期结果**: 显示所有级别的日志，包括VERBOSE

### 4. 测试WebSocket连接日志

1. 选择一个Token并连接
2. 观察控制台输出

**应该看到格式化的日志**：
```
[HH:MM:SS] [TOKEN] [INFO] Token更新成功
[HH:MM:SS] [WS] [INFO] 🔗 WebSocket连接: token_xxx
[HH:MM:SS] [TOKEN] [DEBUG] 开始更新token...
```

### 5. 测试日志持久化

1. 刷新页面
2. 查看日志级别是否保持

**预期结果**: 
- 设置的日志级别应该保存在localStorage中
- 刷新后仍然生效

---

## 🎯 验收标准

- [ ] 浏览器控制台可以访问`wsDebug`对象
- [ ] `wsDebug.quiet()` 减少日志输出
- [ ] `wsDebug.normal()` 恢复正常日志
- [ ] `wsDebug.debug()` 显示调试日志
- [ ] `wsDebug.verbose()` 显示所有日志
- [ ] 日志格式包含时间戳、命名空间、级别
- [ ] 刷新页面后日志级别保持
- [ ] 生产环境默认只显示WARN和ERROR
- [ ] WebSocket连接正常工作
- [ ] Token选择和切换正常
- [ ] 批量任务功能不受影响（通过shouldLog配置仍然可用）

---

## 📊 对比效果

### 修改前：
```
❌ 解析 gameTokens 失败，使用空数组
[TokenStore] 开始更新token，角色ID: token_xxx
[TokenStore] 更新前的token数据: {...}
...（大量日志）
```

### 修改后：
```
[10:30:15] [TOKEN] [ERROR] ❌ 解析 gameTokens 失败，使用空数组
[10:30:16] [TOKEN] [INFO] Token更新成功
[10:30:16] [WS] [INFO] 🔗 WebSocket连接: token_xxx
```

**优势**：
- ✅ 格式统一，易于阅读
- ✅ 包含时间戳，方便追踪
- ✅ 可以动态调整日志级别
- ✅ 生产环境自动减少日志
- ✅ 不影响现有功能

---

## 🐛 常见问题

### Q1: 控制台找不到wsDebug对象
**A**: 检查logger.js是否正确导入到tokenStore.js

### Q2: 日志没有减少
**A**: 
1. 确认执行了`wsDebug.quiet()`
2. 刷新页面
3. 检查localStorage中的`ws_debug_level`

### Q3: 批量任务日志配置失效
**A**: 不会失效，shouldLog机制仍然保留，用于批量任务日志配置

### Q4: 日志格式显示异常
**A**: 检查浏览器Console设置，确保启用了时间戳显示

---

## 🎉 测试通过后

完成测试后，更新TODO状态：
- [x] 阶段1-1: 添加logger.js ✅
- [x] 阶段1-2: 修改tokenStore.js ✅
- [x] 阶段1-3: 测试logger系统 ✅

**下一步**: 进入阶段2 - 实现月度任务系统

---

## 💡 调试技巧

### 临时启用详细日志
```javascript
// 在控制台执行
wsDebug.verbose()
// 执行你要调试的操作
// 完成后恢复
wsDebug.normal()
```

### 查看当前日志级别
```javascript
localStorage.getItem('ws_debug_level')
// 返回: "2" (INFO), "3" (DEBUG), etc.
```

### 清除日志设置
```javascript
localStorage.removeItem('ws_debug_level')
localStorage.removeItem('ws_debug_verbose')
location.reload()
```

---

**准备好后，进入下一阶段！** 🚀