203 lines
5.2 KiB
Markdown
203 lines
5.2 KiB
Markdown
# Debug Mode - 调试指南
|
||
|
||
## 调试模式已启用 ✅
|
||
|
||
我已经在以下文件中添加了详细的调试日志：
|
||
|
||
### 修改的文件
|
||
1. **[background.js](background/background.js)** - Background script 调试日志
|
||
2. **[popup.js](ui/popup/popup.js)** - Popup UI 调试日志
|
||
|
||
### 新增的文件
|
||
3. **[debug-helper.js](debug-helper.js)** - 调试辅助脚本
|
||
|
||
---
|
||
|
||
## 如何使用调试功能
|
||
|
||
### 方法一：查看自动日志（推荐）
|
||
|
||
1. **重新加载扩展**
|
||
- 打开 `chrome://extensions/`
|
||
- 找到 "Payment Automation Suite"
|
||
- 点击刷新图标 🔄
|
||
|
||
2. **打开 Background 日志**
|
||
- 在扩展页面，点击 "Inspect views: service worker"
|
||
- 会打开一个新的开发者工具窗口
|
||
- 这里会显示所有 `[Background DEBUG]` 日志
|
||
|
||
3. **打开 Popup 日志**
|
||
- 点击扩展图标打开 popup
|
||
- 在 popup 上右键 → "检查"
|
||
- 会打开 popup 的开发者工具
|
||
- 这里会显示所有 `[Popup DEBUG]` 日志
|
||
|
||
4. **测试切换功能**
|
||
- 打开 Master Control
|
||
- 观察日志输出，你会看到：
|
||
```
|
||
[Popup DEBUG] handleMasterToggle: User toggled master switch to true
|
||
[Popup DEBUG] handleMasterToggle: Sending TOGGLE_MASTER message
|
||
[Background DEBUG] Received message: {type: "TOGGLE_MASTER", enabled: true}
|
||
[Background DEBUG] toggleMaster called: true
|
||
[Background DEBUG] Current config before master toggle: {...}
|
||
[Background DEBUG] Updated config with all modules: {...}
|
||
[Background DEBUG] Config after master toggle: {...}
|
||
```
|
||
|
||
5. **关闭并重新打开 popup**
|
||
- 观察 `loadConfig` 的日志
|
||
- 检查是否正确加载了之前保存的配置
|
||
|
||
---
|
||
|
||
### 方法二：使用调试辅助脚本
|
||
|
||
这个脚本可以一次性检查所有状态，非常适合诊断问题。
|
||
|
||
1. **打开扩展 popup**（点击扩展图标）
|
||
|
||
2. **打开开发者工具**（在 popup 上右键 → "检查"）
|
||
|
||
3. **运行调试脚本**
|
||
- 打开 [`debug-helper.js`](debug-helper.js) 文件
|
||
- 复制所有内容
|
||
- 粘贴到控制台中
|
||
- 按回车
|
||
|
||
4. **执行诊断**
|
||
```javascript
|
||
await debugExtension()
|
||
```
|
||
|
||
这会显示完整的诊断报告：
|
||
- ✅ Storage 数据（sync 和 local）
|
||
- ✅ 所有模块的状态
|
||
- ✅ 统计数据
|
||
- ✅ Background 通信测试
|
||
- ✅ DOM 元素检查
|
||
- ✅ Storage 配额使用情况
|
||
|
||
---
|
||
|
||
## 调试辅助函数
|
||
|
||
在加载 `debug-helper.js` 后，你可以使用这些便捷函数：
|
||
|
||
### `await checkStorage()`
|
||
快速查看当前 storage 状态
|
||
```javascript
|
||
await checkStorage()
|
||
```
|
||
|
||
### `await enableAllModules()`
|
||
一键启用所有模块
|
||
```javascript
|
||
await enableAllModules()
|
||
```
|
||
|
||
### `await disableAllModules()`
|
||
一键禁用所有模块
|
||
```javascript
|
||
await disableAllModules()
|
||
```
|
||
|
||
### `await resetStorage()`
|
||
⚠️ 清空所有 storage（慎用！）
|
||
```javascript
|
||
await resetStorage()
|
||
```
|
||
|
||
---
|
||
|
||
## 诊断常见问题
|
||
|
||
### 问题 1：模块总是关闭
|
||
**症状：** 打开模块后，关闭 popup 再打开，所有模块都关了
|
||
|
||
**检查步骤：**
|
||
1. 打开 Background 日志窗口
|
||
2. 切换一个模块
|
||
3. 查找这些日志：
|
||
- `[Background DEBUG] toggleModule called`
|
||
- `[Background DEBUG] Modules after save`
|
||
4. 关闭并重新打开 popup
|
||
5. 查找：
|
||
- `[Popup DEBUG] loadConfig: Received config from storage`
|
||
- 检查 `config.modules` 中的 `enabled` 值是否为 `true`
|
||
|
||
**可能原因：**
|
||
- Storage 没有正确保存 → 会在 "Modules after save" 中显示 `enabled: false`
|
||
- Storage 保存了但加载失败 → 会在 "Received config from storage" 中显示异常
|
||
- Background script 崩溃 → 消息发送失败，会有 error 日志
|
||
|
||
---
|
||
|
||
### 问题 2：Advanced Settings 无法打开
|
||
**症状：** 点击 "Advanced Settings" 按钮没反应
|
||
|
||
**检查步骤：**
|
||
1. 打开 Popup 日志
|
||
2. 点击 "Advanced Settings" 按钮
|
||
3. 查找：`[Popup DEBUG] Options button clicked`
|
||
4. 如果没有这条日志 → 按钮事件监听器未绑定
|
||
5. 如果有日志但没打开 → 检查是否有错误信息
|
||
|
||
**手动打开 Options 页面：**
|
||
```javascript
|
||
chrome.runtime.openOptionsPage()
|
||
```
|
||
|
||
或者直接访问：
|
||
- `chrome-extension://[扩展ID]/ui/options/options.html`
|
||
- 在 `chrome://extensions/` 页面找到扩展，点击 "Details" → "Extension options"
|
||
|
||
---
|
||
|
||
### 问题 3：Storage 配额不足
|
||
**症状：** Storage 操作失败，或数据丢失
|
||
|
||
**检查：**
|
||
```javascript
|
||
await debugExtension()
|
||
```
|
||
查看 "Storage quota" 部分
|
||
|
||
**解决方法：**
|
||
- 如果使用超过 80%，考虑清理或优化数据结构
|
||
- Chrome storage.sync 限制：100KB 总容量
|
||
|
||
---
|
||
|
||
## 关闭调试模式
|
||
|
||
如果你想关闭详细日志（提高性能），修改这两个文件：
|
||
|
||
### [background.js](background/background.js#L7)
|
||
```javascript
|
||
const DEBUG = false; // 改为 false
|
||
```
|
||
|
||
### [popup.js](ui/popup/popup.js#L6)
|
||
```javascript
|
||
const DEBUG = false; // 改为 false
|
||
```
|
||
|
||
然后重新加载扩展。
|
||
|
||
---
|
||
|
||
## 下一步
|
||
|
||
现在请你：
|
||
|
||
1. **重新加载扩展**
|
||
2. **打开 Background 日志窗口**（Inspect service worker）
|
||
3. **打开 Popup 并打开日志窗口**（右键检查）
|
||
4. **切换 Master Control 和几个模块**
|
||
5. **关闭 popup，等 2 秒，重新打开**
|
||
6. **截图或复制所有日志发给我**
|
||
|
||
这样我就能准确看到是哪里出了问题！🔍
|