xsl/juzi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(h5): center score stack, lock profile scroll and gate turn guidance

Browse Source
This commit is contained in:
xsl
2026-10-12 23:48:11 +08:00
parent 2a49ebdab2
commit 6f83f58a09
17 changed files with 1396 additions and 969 deletions
Download Patch File Download Diff File Expand all files Collapse all files
h5/test/report-touch-layout.mjs
+7 -7
View File
@@ -33,21 +33,21 @@ try {
for (const width of [320, 375, 390, 414, 480]) {
await page.setViewportSize({ width, height: 844 });
await page.waitForTimeout(400);
for (const score of ['0', '75', '100', '--']) {
for (const score of ['0', '75', '82', '100', '--']) {
await page.locator('#stat-score b').evaluate((el, value) => { el.textContent = value; }, score);
const layout = await page.evaluate(() => {
const rect = selector => {
const r = document.querySelector(selector).getBoundingClientRect();
return { x: r.x, y: r.y, width: r.width, height: r.height, bottom: r.bottom };
};
return { dial: rect('.score-dial'), score: rect('#stat-score b'), title: rect('.sum-score > .stat-label'),
ageTitle: rect('.sum-age > .stat-label'), age: rect('.age-dial'),
return { dial: rect('.score-dial'), score: rect('#stat-score b'), title: rect('.ring-center .stat-label'),
ageTitle: rect('.sum-age > .stat-label'), age: rect('#stat-age b'),
careAlign: getComputedStyle(document.querySelector('.card-care .card-heading')).textAlign };
});
assert(Math.abs(layout.score.x + layout.score.width / 2 - layout.dial.x - layout.dial.width / 2) < 1, 'score horizontally centered: ' + width + '/' + score);
assert(Math.abs(layout.score.y + layout.score.height / 2 - layout.dial.y - layout.dial.height / 2) < 1, 'score vertically centered');
assert(layout.title.bottom < layout.dial.y && layout.ageTitle.bottom < layout.age.y, 'labels outside above their values');
assert(Math.abs(layout.title.y - layout.ageTitle.y) < 1, 'labels share top alignment');
assert(Math.abs((layout.title.y + layout.score.bottom) / 2 - layout.dial.y - layout.dial.height / 2) < 1, 'complete label + score stack vertically centered');
assert(layout.title.y > layout.dial.y && layout.score.bottom < layout.dial.bottom, 'both label and score stay inside the circle');
assert(Math.abs(layout.age.y - layout.ageTitle.bottom - 25) < 1, 'age label-to-number gap is exactly 25 CSS px');
assert.equal(layout.careAlign, 'left');
}
assert(await page.evaluate(() => document.documentElement.scrollWidth <= innerWidth));
@@ -127,5 +127,5 @@ try {
await page.screenshot({ path: path.join(process.env.H5_ARTIFACT_DIR, 'report-summary.png') });
}
assert.deepEqual(errors, []); assert.deepEqual(writes, []);
console.log('PASS: score centered/labels above/care left in five widths; real finger-following three report groups, flick/snap/cancel/vertical/edges/keyboard/zoom/resize/height/ARIA; smaller JPEG hashes/dimensions/MIME; no JS errors/backend writes');
console.log('PASS: whole score stack centered inside circle/age gap 25px/care left in five widths; real finger-following three report groups, flick/snap/cancel/vertical/edges/keyboard/zoom/resize/height/ARIA; smaller JPEG hashes/dimensions/MIME; no JS errors/backend writes');
} finally { await browser.close(); }