feat(h5): align third feedback with latest PSD and scanning screen

This commit is contained in:
xsl
2026-10-12 16:33:10 +08:00
parent f3e7eac909
commit c7b085e795
30 changed files with 3343 additions and 987 deletions
+14 -18
View File
@@ -21,31 +21,27 @@ try {
for (const width of [320, 375, 390, 414, 480]) {
await page.setViewportSize({ width, height: 726 });
const home = await page.evaluate(() => {
const en = getComputedStyle(document.querySelector('.splash-slogan-en'));
const zh = getComputedStyle(document.querySelector('.splash-slogan-zh'));
const text = document.querySelector('#s-splash .brand-text');
const style = getComputedStyle(text);
const logo = document.querySelector('#s-splash .brand-logo').getBoundingClientRect();
const lockup = document.querySelector('#s-splash .brand-lockup');
const logo = lockup.getBoundingClientRect();
const row = document.querySelector('#s-splash .brand-row').getBoundingClientRect();
const slogan = document.querySelector('.splash-slogan').getBoundingClientRect();
const sloganImage = document.querySelector('#s-splash .splash-slogan');
const slogan = sloganImage.getBoundingClientRect();
const badge = document.querySelector('.account-status-home').getBoundingClientRect();
const ctx = document.createElement('canvas').getContext('2d');
ctx.font = `${style.fontWeight} ${style.fontSize} ${style.fontFamily}`;
const metrics = ctx.measureText(text.textContent);
return { en: en.fontWeight, zh: zh.fontWeight, size: style.fontSize, weight: style.fontWeight,
logoHeight: logo.height, inkHeight: metrics.actualBoundingBoxAscent + metrics.actualBoundingBoxDescent,
return { logoHeight: logo.height, source: lockup.getAttribute('src'), alt: lockup.alt,
logoRatio: logo.width / logo.height, rowX: row.x, rowRight: row.right,
badgeBottom: badge.bottom, sloganTop: slogan.top,
sloganLines: slogan.height / parseFloat(zh.lineHeight), overflow: document.documentElement.scrollWidth > innerWidth };
sloganRatio: slogan.width / slogan.height, sloganAlt: sloganImage.alt,
overflow: document.documentElement.scrollWidth > innerWidth };
});
assert.equal(home.en, '400'); assert.equal(home.zh, '700');
assert.equal(home.size, '24px'); assert.equal(home.weight, '700');
assert.equal(home.logoHeight, 26);
assert(Math.abs(home.inkHeight - home.logoHeight) <= 4, 'logo/text optical height mismatch: ' + JSON.stringify(home));
assert(Math.abs(home.logoRatio - 132 / 59) < .01, 'logo must retain original aspect ratio');
// Third-round PSD replaces platform-dependent glyphs with the exact lockup.
assert(home.source.endsWith('ui-20261012/brand-lockup.png'));
assert.equal(home.alt, "1'me 肌肤状态检测");
assert(Math.abs(home.logoHeight - 59 / 2.88) < .02);
assert(Math.abs(home.logoRatio - 517 / 59) < .01, 'lockup must retain PSD aspect ratio');
assert(Math.abs(home.sloganRatio - 718 / 217) < .01, 'three-line PSD slogan must retain its aspect ratio');
assert(home.sloganAlt.includes('以我为始 自有表现'));
assert(home.rowX >= 0 && home.rowRight <= width && !home.overflow, 'brand row overflows at ' + width);
assert(home.badgeBottom <= home.sloganTop, 'status badge overlaps slogan at ' + width);
assert(Math.abs(home.sloganLines - 3) < .1, 'slogan must retain three lines at ' + width);
}
await page.setViewportSize({ width: 375, height: 726 });
if (artifacts) {