iter(g186): 固化视觉回归抽查清单
This commit is contained in:
@@ -64,6 +64,60 @@ qa/probe ──门禁通过──▶ qa/stable ──人工审阅──▶ main
|
||||
2. **视觉欠账优先**:只要存在 `status === "open"` 且 `domain === "visual"` 的条目,它的优先级高于 `domain === "new"` 的条目——先清视觉欠账,再加新组件(视觉地基不牢,新组件只是把漂移再复制一份)。
|
||||
3. **新增组件的入库门槛**:`domain === "new"` 的条目,验收标准里必须写明「样式只消费 `--ua-*` 令牌,禁止新增硬编码阴影/时长/字号」,否则该条不得入库。视觉类改进的验收标准要能落到 `npm run audit:visual` 的计数上(涨了就是没做完)。
|
||||
|
||||
## 视觉回归抽查清单(人工,视觉类条目收尾时逐条过)
|
||||
|
||||
视觉改动只能靠人眼验收,凭记忆看一遍必然漏项。本节把六个高频组件的观感要点固化成可勾选项,视觉类条目(`domain === "visual"`)提交前照单过一遍,勾不上的就是没做完。
|
||||
|
||||
- **格式约定**:三条横线以下是清单本体,每个组件一个 `### <组件id>` 段,每条以 `- [ ] 【维度】` 开头;维度取值固定五类:`边框` / `阴影` / `过渡` / `焦点环` / `暗色`。
|
||||
- **门禁口径**:`ua verify` 校验本节存在、六个组件齐全、每个组件 ≥3 条、合计 ≥18 条、五个维度全覆盖;条目改写或删漏直接报错。
|
||||
- **与自动门禁的分工**:`npm run audit:visual` 管「字面量有没有回流成硬编码」,本节管「令牌用对了但观感对不对」——两者都过才算一轮视觉改动完成。
|
||||
|
||||
---
|
||||
|
||||
### button
|
||||
|
||||
- [ ] 【边框】次按钮与描边按钮的 1px 描边在页面底与卡片底上亮度一致,不出现某个按钮偏黑
|
||||
- [ ] 【阴影】hover 只上浮 1–2px 且走 elevation 令牌,没有「影子 + 边框」双层叠加
|
||||
- [ ] 【过渡】hover 上浮与按下回缩能看出先后,时长不超过 `--ua-duration-fast`
|
||||
- [ ] 【焦点环】键盘 Tab 到按钮时环完整贴边不被容器裁切,与描边按钮的描边不重影
|
||||
- [ ] 【暗色】暗色下主按钮文字与底色对比仍够,描边按钮的边不消失
|
||||
|
||||
### textField
|
||||
|
||||
- [ ] 【边框】默认 / hover / 聚焦三态只变色不变粗细(1px 始终 1px)
|
||||
- [ ] 【焦点环】聚焦是光环外扩而非描边变粗;带前后缀时环包住整组而不只是输入框
|
||||
- [ ] 【过渡】聚焦与失焦的边框色过渡在 `--ua-duration-fast` 内完成,无闪烁感
|
||||
- [ ] 【暗色】暗色下占位文字(placeholder)与输入文字都可读,边框仍可见
|
||||
|
||||
### select
|
||||
|
||||
- [ ] 【边框】触发器与相邻 textField 同高同粗细,并排时基线不歪
|
||||
- [ ] 【阴影】下拉弹层用 `--ua-shadow-2` 档,出现在滚动容器内时边缘不被裁成硬边
|
||||
- [ ] 【过渡】弹层进出各一次(位移 + 淡入),关闭后不残留一帧
|
||||
- [ ] 【焦点环】键盘 ↑↓ 唤出弹层时焦点环留在触发器上,不跳到 body
|
||||
|
||||
### modal
|
||||
|
||||
- [ ] 【阴影】弹窗用 `--ua-shadow-4`,与遮罩形成明确层级,不糊成一片
|
||||
- [ ] 【边框】页头 / 页脚分割线用 `--ua-border-subtle`,观感与卡片页脚一致
|
||||
- [ ] 【过渡】弹入有轻微缩放位移,Esc 关闭后无残影、无布局跳动
|
||||
- [ ] 【焦点环】打开后焦点落在弹窗内首个可聚焦元素,Tab 不逃出弹窗
|
||||
- [ ] 【暗色】暗色下弹窗表面与遮罩可区分,标题与正文层级仍清楚
|
||||
|
||||
### dataTable
|
||||
|
||||
- [ ] 【边框】行分割线用 `--ua-border-subtle`,连续 20 行不显重,表头下沿不发黑
|
||||
- [ ] 【阴影】粘性表头滚动透底无效(背景实色 + 底部 1px 细线贴合)
|
||||
- [ ] 【过渡】行 hover 与选中底色过渡柔和,选中行不抢表头与首列的视线
|
||||
- [ ] 【暗色】暗色下斑马纹可辨但不突兀,选中行与 hover 行仍能区分
|
||||
|
||||
### toast
|
||||
|
||||
- [ ] 【阴影】通知用最高档投影,堆叠三条时前后层级清楚
|
||||
- [ ] 【边框】通知卡片描边不抢语义色图标,警示色不溢出到边框
|
||||
- [ ] 【过渡】进场 / 出场各一次,堆叠时其余条目平滑让位,不出现跳位
|
||||
- [ ] 【暗色】四种语义色(info / success / warning / error)在暗底上图标与文字都不糊
|
||||
|
||||
## 人工介入点
|
||||
|
||||
- 审阅 `qa/stable` 的提交,确认质量后合入 `main`(PR 或本地 merge 后推送)。
|
||||
|
||||
Reference in New Issue
Block a user