fix(diy-card): 审计修复——corner 档头部水平让位动态化 + self 首载骨架屏
- 修复 P1: corner 档自定义 qrSize>120 时静态 padding-right:180rpx 让位不足, 浮层压住头部姓名区 → 新增 cornerHeadStyle 按浮层实际 宽度(尺寸+衬底+右偏移20+呼吸20)动态反算, 与 cornerClearStyle 垂直让位同口径; 废弃静态 CSS 值(负断言锁定) - 修复: self.vue 已登录首次加载三分支都不渲染(loading 且无 card) → 白屏闪烁; 改 v-else-if="loading || card" 挂上 mini 骨架屏 - 契约测试: 新增 cornerHeadStyle 断言 + resolveQrSize 三处口径 + 静态让位废弃负断言; 3 项变异验证全抓住; 四文件 67 项全绿
This commit is contained in:
@@ -110,10 +110,12 @@ test('mini: 二维码四档渲染分支齐全', () => {
|
||||
test('mini: corner 档 Logo 避让 + 资料行/操作区动态让位', () => {
|
||||
assert.match(miniSrc, /showLogo\(\)\s*\{[\s\S]*?this\.qrPos !== 'corner'/);
|
||||
assert.match(miniSrc, /:class="\{ 'qr-at-corner': qrPos === 'corner' \}"/);
|
||||
// 头部固定让位(头像|信息|二维码 三段 flex, 信息区不被右上浮层压)
|
||||
assert.match(miniSrc, /&\.qr-at-corner \{[\s\S]*?\.mini-head\s*\{\s*padding-right: 180rpx;/);
|
||||
// 头部水平让位 = cornerHeadStyle 动态反算(审计修复: 静态 180rpx 在自定义大尺寸下不足)
|
||||
assert.match(miniSrc, /<view class="mini-head" :style="cornerHeadStyle">/);
|
||||
// 资料行/操作区让位 = cornerClearStyle 动态反算(自定义大尺寸/关 tip 自动跟随, 不用 calc)
|
||||
assert.match(miniSrc, /:style="cornerClearStyle"/);
|
||||
// 静态 CSS 让位必须已移除(动态值才是单一事实来源)
|
||||
assert.ok(!/padding-right: 180rpx;/.test(miniSrc), '静态 180rpx 让位应废弃, 改由 cornerHeadStyle 动态给出');
|
||||
// 浮层 CSS 只定位于层次; 视觉衬底(白卡等)由 qrBlockStyle 内联决定
|
||||
assert.match(miniSrc, /&\.mini-qr-corner \{\s*position: absolute;\s*top: 20rpx;\s*right: 20rpx;\s*z-index: 3;\s*margin-top: 0;\s*box-shadow:/);
|
||||
assert.ok(!/&\.mini-qr-corner \{[\s\S]*?background: #ffffff;/.test(miniSrc),
|
||||
|
||||
Reference in New Issue
Block a user