[ISSUE-0035] 「去创建任务」按钮无反应¶
用户反馈:截图主面板"还没有任何数据"空状态,点黑色"去创建任务"按钮完全无反应。
用户感知¶
新用户首次进入"数据 → 商家列表"看到空状态:
点按钮 → 什么都没发生(应该跳到任务页 + 打开创建对话框)。
根因:两套 storage API 混用¶
local-data-view.tsx:743 按钮 onClick:
// v0.10.53 之前 ❌
browser.storage.local.set({
'local:popup-action': { type: 'go-page', page: 'task', t: Date.now() },
}).catch(() => {});
main-layout.tsx:194 监听:
两段代码看似都用 'local:popup-action',但实际是两套不同的 API:
| API | 完整 key 写到 chrome.storage 后 | 接收方期望 |
|---|---|---|
原生 browser.storage.local.set({'local:popup-action': ...}) |
chrome key = local:popup-action(字面量) |
— |
wxt/storage 抽象 storage.watch('local:popup-action', ...) |
监听 chrome key = popup-action(去掉 local: 前缀,prefix 仅用来选 area) |
— |
永远不会收到通知 → 按钮点了无反应。
为什么 5 轮 audit + 5 个扫描工具都没发现¶
| 防御层 | 为什么没抓到 |
|---|---|
| TypeScript | 两套 API 都合法,类型对 |
| scan:mv3 | 关注 MV3 持久化陷阱(let/setTimeout/listener),不查 API 一致性 |
| scan:react | 关注 useEffect cleanup |
| scan:protocol | 关注 webext-bridge onMessage,不查 storage |
| scan:pump-coverage | 关注调度恢复路径 |
| scan:issue-coverage | 关注 ISSUE 改动反查 |
| 5 轮独立 agent | 都聚焦 background/调度/状态机,没逐个点击 UI 按钮 verify 行为 |
只有真实用户使用才发现。这是 ISSUE-0034 之后第 2 个用户实测反馈的 bug。
第 5 轮 agent 自己说过:
剩余的"虚化"bug 类别:大并发 race / Chrome 内部 API / 用户极端配置 — 都不是 audit 能找到的,需要真实使用反馈或 E2E 测试。
ISSUE-0035 正是这类。
修复¶
// v0.10.53 ✅
import { storage } from 'wxt/storage';
storage.setItem('local:popup-action', { type: 'go-page', page: 'task', t: Date.now() })
.catch(() => {});
storage.setItem('local:xxx', ...) 是 wxt/storage 抽象 — 内部翻译成正确的 chrome key,watcher 能收到。
audit_grep 防同款¶
frontmatter 加:
audit_grep:
- pattern: "browser\\.storage\\.local\\.set\\(\\{'local:"
description: "原生 API 写 wxt-namespaced key — 永远不会被 wxt watch 触发"
pnpm scan:issue-coverage 会全仓 grep,未来如果有人再写这种代码会被立即捕获。
改动文件¶
| 文件 | 改了什么 |
|---|---|
src/sections/page/local-data-view.tsx |
onClick 改用 wxt/storage 抽象 + import storage |
package.json |
0.10.52 → 0.10.53 |
验证¶
- ✅
pnpm compile0 错 - ✅
pnpm build7.88s - ✅
pnpm scan:issue-coverage0 命中(同模式已修干净) - 📋 浏览器实测:清空数据 → 点"去创建任务" → 应跳到任务页
如何避免再犯¶
- storage 操作统一用
wxt/storage— 全仓禁用browser.storage.local.set/chrome.storage.local.set原生 API - 加 audit_grep 让 scan:issue-coverage 全仓扫
- 新加按钮要测真实点击 — 不光看代码逻辑
元-观察:第 2 个用户使用反馈发现的 bug¶
v0.10.52 ISSUE-0034: Failed to fetch 冒 chrome 错误页
v0.10.53 ISSUE-0035: 按钮无反应(本 issue)
5 轮 agent + 5 工具收敛 ≠ 真的没问题。
真实用户使用是 audit 不能替代的检验。
后续可以加:
1. E2E 测试覆盖关键 UI 路径("去创建任务"按钮 / 拦截恢复按钮 / 等)
2. 写 rule docs/rules/storage-api统一规范.md(强制 wxt/storage)
相关¶
- [[0034-failed-to-fetch-leak-to-chrome-err-log|0034-Failed-to-fetch-冒到chrome扩展错误日志]] — 同期用户实测反馈发现
- 5 轮 agent CONVERGENCE 报告里提到的"虚化 bug 类别"