设置弹窗的固定高度只用 dvh 写、没有回退。不认识该单位的引擎会把整条 height 与 max-height 作废,盒子退回按内容撑开,于是切分区就跳大小—— 这正是 BUG-554 现象的复发,而 BUG-554 的防复发「必须同时声明 width 与 height」只检查声明存不存在,挡不住「写了但没生效」。 实测(Chrome 151,真实产物 CSS + 复刻 DOM,1440×900):dvh 正常时四个 分区恒定 866.80×640px,**事故不复现**;摘掉 dvh 后变成 313/313/378/1130, 宽度不动——与用户描述的形状完全一致。因此机制已证实,但用户当时的浏览器 未定位,BUG-698 记为 investigating 而非 resolved。 附带发现:任务书要求照抄的重复声明式回退 `height: 100vh; height: 100dvh;` 在本仓根本发布不出去——Lightning CSS 会合并同名属性的重复声明只留最后一条, 全仓唯一那处回退(sidebar-provider)在线上早就是死的,还有一条测试专门守着 这个从未发布过的写法。改用 @supports (height: 1dvh):vh 作基线,dvh 作升级。 修复后不支持 dvh 的引擎也收敛到恒定 640px,支持的逐像素无变化。 同轮按产品决策去掉设置分区菜单的左侧/下方强调色条,选中与悬停改用面与 墨色等级区分,不用色相、不用字重。左侧会话列表的色条本轮不动。 - 新增 viewport-unit-fallback-contract(3 条,全文件),三次破坏性验证各自打红 - account-dialog-overlay 新增同尺寸契约与分区菜单契约 - 三条钉死旧 dvh 字面量的既有断言按「原值/新值/原因」更新,均未弱化 - tsc 0 错;lint 0 error / 118 warning(持平);npm test 3346/3300/fail 31, 失败清单与基线逐字相同;/ 仍 ○ Static;样式 gzip +0.38%; 快速门 pytest 段 792 passed / 1 skipped / 0 failed Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01JUei7K13cYxLHE3Axe4A45
4.4 KiB
4.4 KiB
真人验收清单 · 设置弹窗尺寸与分区菜单(BUG-698 + 分区菜单产品决策)
- 日期:2026-09-16
- 分支:
codex/settings-dialog-size-and-nav-20260916 - 对应:
docs/tasks/TASK-settings-dialog-size-and-nav-20260915.md、docs/tasks/PROGRESS-settings-dialog-size-and-nav-20260916.md
会话侧已经量过的(不用再做):真实产物 CSS + 复刻 DOM 的离线页面上,四个分区在支持与不支持 dvh 两种引擎下都恒定 866.80 × 640px。下面全是会话做不了的:需要登录态、真实内容、真实设备、以及人眼。
A. 尺寸:四个分区切换不跳变
- 登录后打开设置弹窗。
- 依次点 个人资料 → 星盘资料 → 账户与点数 → 通用设置 → 再点回 个人资料。
- 看外框四条边有没有动。 尤其是底边:星盘资料内容最多、通用设置最少,是最容易露馅的一对。
- 通过标准:外框纹丝不动,只有右侧内容区在换;左侧 176px 导航与标题栏不动。
在这几种窗口下各走一遍:
| 场景 | 怎么弄 | 预期 |
|---|---|---|
| 桌面常规 | 浏览器最大化 | 宽 880px 上限,高 640px,四分区全等 |
| 矮窗口 | 把窗口高度拖到 600px 左右 | 高度变成 84% 视口高,四分区仍全等 |
| 窄窗口 | 宽度拖到 900px 以下 | 宽度跟着收,四分区仍全等 |
| 手机宽度 375px | DevTools 设备模拟 或 真机 | 弹窗全屏,导航变顶部四栏,切换不跳 |
- 星盘资料分区要展开到最满再切:进列表 → 点开某个人的详情 → 再切到 通用设置。内容最多的一刻切走,是本 Bug 最容易复现的时机。
B. 尺寸:旧引擎(本 Bug 的真正目标环境)
本条是定位用的,不是回归用的。BUG-698 停在 investigating 就是因为没人知道用户当时用的什么浏览器。
- 产品负责人回忆并回答:出现「选别的就立马缩小」时,用的是哪个浏览器、哪个版本、什么设备?是电脑浏览器,还是微信 / QQ 里点开的?窗口多大?能否截图?
- 若手边有 iOS 15.0–15.3 的旧 iPad / iPhone,或较老的安卓机(System WebView 低于 108),在上面走一遍 A 的第 1–4 步。
- 修复前:高度会随分区跳(这就是用户看到的)。
- 修复后:应当恒定。
- 若产品负责人当时用的是新版 Chrome / Safari,那么本轮的修复解释不了那次现象,需要带着截图另开一轮 —— 请如实回报,不要因为现在看着正常就当作已修。
C. 分区菜单:三态可分辨
- 打开设置弹窗,鼠标不要碰导航,看当前分区那一项:应是实心浅底 + 深墨字。
- 鼠标划过另外三项:应出现比选中更淡的一层底,字仍是次级墨(比选中浅一档)。
- 通过标准:
- 没有任何左侧竖色条(这是本轮产品要求删掉的东西)。
- 选中项与悬停项一眼能分出谁是当前:选中的底更实、字更黑。
- 字没有变粗(产品明确不要加粗)。
- 把鼠标移到当前分区上(同时是选中 + 悬停):不应闪烁或变得比不悬停时更淡。
D. 分区菜单:深色主题
- 系统或应用切到深色,重复 C 的 1–4。
- 通过标准:深色下悬停那层淡底仍然看得见(这是 55% 混透明,深色底上对比最容易不够,是本轮最需要人眼确认的一点);选中仍比悬停重一档。
- 若深色下悬停几乎看不出来,如实回报,把 55% 调高即可 —— 不要改成加色条或加粗。
E. 移动端(≤767px)
- 375px 宽下打开设置弹窗:导航是顶部四栏。
- 通过标准:当前那一栏是实心底 + 深墨字;底部没有横向色条(本轮删掉的);四栏等宽,点哪栏切哪栏。
- 触摸设备没有 hover,所以这里只需确认「当前」这一态够明显。
F. 不该被碰到的(回归检查)
- 左侧会话列表里当前会话的 2px 竖色条仍在 —— 本轮只删设置弹窗的,会话列表那条产品说了不动。两处观感暂时不一致是已知且授权的。
- 键盘 Tab 走到分区按钮上,焦点描边仍在。
- 退出登录确认弹窗仍是 400px 的小框,没被撑成大弹窗。
- 登录页、后台页面(
/admin)、移动端侧栏抽屉的满屏高度正常 —— 本轮一并改了它们的 dvh 写法。