三条控制台红字定性:SVG 属性非法是我方缺陷(BUG-906)、无参 status 404 是设计噪音(BUG-907)、reportAllChanges 是扩展注入脚本不处理。 Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01JUei7K13cYxLHE3Axe4A45
7.8 KiB
7.8 KiB
任务书 · 控制台报错清理:SVG height="auto" 与 /api/consult/status 404 噪音(2026-09-16)
0. 基线
- 基线 commit:
05cf20fb(origin/staginghead,staging/api/health的deployment.gitCommit与之相同)。 - 分支:
codex/console-noise-20260916,git worktree add -b codex/console-noise-20260916 .worktrees/console-noise-20260916 origin/staging。 - 范围:只有前端。不动 Python、不动迁移、不动 Skill。
- BUG 段:BUG-906 起(基线
docs/BUG_HISTORY.md最大号 BUG-905,开工时再核对一次)。
1. 事故实证
产品负责人 2026-09-16 在 staging 首页控制台连续看到三类红字:
| # | 控制台原文 | 来源 | 定性 |
|---|---|---|---|
| A | Error: <svg> attribute height: Expected length, "auto". |
frontend/src/components/chart-page/western-wheel-svg.tsx:31、frontend/src/components/personal-report/vedic-chart-svg.tsx:98 都写了 height="auto" |
我方代码缺陷。SVG 的 height 表现属性只接受长度/百分比,auto 只是 CSS 值。浏览器丢弃该属性后星盘仍能画,但每渲染一张盘报一次;报告页 22 张盘就是 22 条 |
| B | GET https://staging.jyotisha.chat/api/consult/status 404 (Not Found) |
无参调用来自 frontend/src/app/page.tsx:974(启动)与 frontend/src/hooks/use-consultation-run.ts:271(页面重新可见、online 事件,见 page.tsx:1328-1330);服务端 frontend/src/app/api/consult/status/route.ts 在 activeLookup 分支查不到 reserved 行时返回 404 |
设计噪音。客户端 fetchActiveConsultationStatus(home-cloud-sync.ts:581-589)已把 404 当"没有后台任务"正常返回 null,业务无失败;但浏览器对所有非 2xx fetch 都打红字,用户每次切回标签页都看到一条 |
| C | Uncaught TypeError: Cannot read properties of undefined (reading 'startTime') at et.reportAllChanges |
VM4285:2,注入脚本 |
非我方代码。站点打包文件都带 ?dpl=05cf20fb… 后缀,VM 编号脚本是浏览器扩展 / DevTools 注入;reportAllChanges 是 web-vitals 库接口,frontend/package-lock.json 里没有该依赖,layout.tsx 只内联主题引导脚本。本单不处理,留在 §7 给用户的验证方法 |
2. 根因
- A:
830799fa(星盘页)与2fdcb14f(报告盘面)把 CSS 的height: auto写成了 SVG 属性。globals.css:4097早已给.personal-report-chart-svg写了height: auto,属性是多余的;.chart-page-western-svg没有对应 CSS 规则,靠的是viewBox+width="100%"自适应。 - B:接口把"没有活动任务"和"指定 requestId 不存在"两种情况都用 404 表达。前者是常态查询的正常空结果,后者才是真正的"不存在"(
page.tsx:965与consultation-recovery.test.ts:88/112依赖它计数)。
3. 决策记录
- 产品负责人 2026-09-16 授权清理这两条控制台噪音,口径是"多余的宁可删"。
- 不推翻任何既有红线:指定
sessionId+requestId的查询继续返回 404(BUG 历史 4107 行一带的刷新恢复逻辑与consultation-recovery.test.ts靠它)。只改无参的activeLookup分支。 - 不做打断合并、不改恢复触发时机(可见性 / online)。
4. 硬红线
page.tsx行数不得增长(AGENTS.md §6)。本单不需要碰它。consultation-stream-recovery.test.ts:121-153对route.ts的结构断言(activeLookup定义、查询链、租约回收块顺序)必须原样通过,不得改断言。chart-page-view.test.tsx:131-135对vedic-chart-svg导入方式的断言不变;globals.css:4599的字号规则不变。- 部署有窗口期(先出新前端还是先出新接口不可控,两者同一镜像但浏览器可能持旧 JS):客户端必须同时接受新旧两种"无活动任务"应答。
- 不顺手动
layout.tsx、不加 web-vitals、不为 C 类报错加任何 try/catch。
5. 任务分解
T1 删掉 SVG 的 height="auto"(BUG-906)
- 改
western-wheel-svg.tsx:31、vedic-chart-svg.tsx:98:删除height="auto"属性。vedic的高度由globals.css:4097兜底;western补一条.chart-page-western-svg { display: block; width: 100%; height: auto; }到globals.css星盘页段落(.chart-page-vedic-stage附近),保证两张盘行为一致。 - 验收:
git grep -n 'height="auto"' frontend/src为 0 命中。- 在
frontend/tests/chart-page-view.test.tsx增加一条契约:两个 SVG 源文件doesNotMatch(/height="auto"/),且globals.css含.chart-page-western-svg的height: auto声明。 - 星盘页与报告页盘面视觉不变(
viewBox与width="100%"未动即可判定;真机对比留 §8)。
T2 无活动任务时不再返回 404(BUG-907)
route.ts的activeLookup分支:查询结果为空时返回new NextResponse(null, { status: 204 })。sessionId+requestId分支查空仍返回 404「咨询请求不存在」,代码上把两处分开写,不要共用那一个if (!data ...)。home-cloud-sync.ts的fetchActiveConsultationStatus:if (response.status === 204 || response.status === 404) return null;。先判状态再response.json(),204 没有 body。fetchConsultationStatus(带参)不改。- 验收:
consultation-stream-recovery.test.ts与consultation-recovery.test.ts原断言全绿。- 新增契约测试(放进
consultation-stream-recovery.test.ts):route 源码里activeLookup空结果分支出现status: 204,带参分支仍出现"咨询请求不存在"+status: 404;home-cloud-sync.ts的无参函数同时接受 204 与 404。 - 用
parseConsultationStatus的既有单测确认不会把 204 的 null body 当作有效状态(它在 204 分支之前就已返回)。
T3 记录
docs/BUG_HISTORY.md新增 BUG-906、BUG-907(现象、触发、根因、修复、验证、防复发);C 类在 BUG-907 的"关联"里写一句"控制台第三条reportAllChanges报错为浏览器扩展注入脚本,非本仓代码,验证方法:无痕窗口"。CHANGELOG.md一条:控制台不再出现星盘 SVG 属性警告与无后台任务时的 404。docs/tasks/PROGRESS-console-noise-20260916.md:测试数字、失败清单与基线逐条比对、gzip 前后。
6. 让步顺序
- T2 若 204 让
next的某条中间件或StaleClientRecovery误判(不太可能,先查stale-client-recovery.tsx是否拦所有非 2xx/非 JSON 应答),退而返回200+{ "status": "none" },客户端parseConsultationStatus之前先判status === "none"返回 null;契约测试相应改。 - T1 的
.chart-page-western-svgCSS 若撞星盘页现有布局(宽度被父容器限定),只删属性、不加规则,在进度记录写明。 - T3 不可让步。
7. 开工前置命令
git fetch origin --prune
git worktree add -b codex/console-noise-20260916 .worktrees/console-noise-20260916 origin/staging
cd .worktrees/console-noise-20260916/frontend
./node_modules/.bin/tsc --noEmit && npm run lint && npm test 2>&1 | tail -20 # 记下基线总数与失败清单
grep -o "BUG-[0-9]\+" ../docs/BUG_HISTORY.md | sort -t- -k2 -n | tail -1 # 应为 BUG-905
验收口径:tsc 0 错;lint 0 error;npm test 失败清单与基线逐条一致(无 Docker 的那组不算新增)且总数不减;next build 后 / 仍 Static;首屏 gzip ±2%。
8. 环境缺口(留给产品负责人真机)
- 部署后在 staging 打开报告页与星盘页:控制台不再有
Expected length, "auto";盘面大小与之前一致。 - 首页切到别的标签页再切回:Network 里
/api/consult/status应为 204,控制台无红字。 - 无痕窗口打开首页:
reportAllChanges … startTime报错应消失;若仍在,把该条连同扩展列表截图发回,另立单。