test(ui): press the CCTV header where it is, and say what a failed lift hit

On the CI runner the header drag stopped lifting CCTV (it did not float),
right after a run where its box never held still: the rail is shifting
there, so the press can land beside the header. It does not reproduce
locally (both gates pass on a fresh key-less dev server). The gate now
waits, bounded at 10 s, until the title point is on the CCTV header before
pressing, and a failed lift reports the element pressed, whether it was in
the header, and where the panel was when docked and at the press.

Co-Authored-By: Claude Opus 5.5 <[email protected]>
This commit is contained in:
Said TurkseverandClaude Opus 5.5 committed 2026-10-05 15:27:15 +01:00
1 parent 8482daa377
commit d9b13c733b
1 file changed
+31 -4
+31 -4
View File
@@ -212,17 +212,44 @@ async function main() {
await page.evaluate((id) => {
window.addEventListener(
'pointerdown',
() => {
(event) => {
const r = document.getElementById(id).getBoundingClientRect();
window.__qaPressBox = { left: r.left, top: r.top, width: r.width };
const target = event.target;
window.__qaPressBox = {
left: r.left,
top: r.top,
width: r.width,
// What the press landed on, so a failed lift says why.
target: `${target.tagName?.toLowerCase()}${target.id ? `#${target.id}` : ''}.${[...(target.classList || [])].join('.')}`,
inHeader: Boolean(target.closest?.(`#${id} .panel-header`)),
};
},
{ capture: true, once: true },
);
}, PANEL_ID);
await drag(await headerPoint(), -200, -100);
// Press only where the header really is: if the rail is still shifting,
// wait (bounded) for the title point to land on the CCTV header.
let grab = await headerPoint();
for (let tries = 0; tries < 20; tries++) {
const onHeader = await page.evaluate(
({ x, y, id }) =>
Boolean(
document.elementFromPoint(x, y)?.closest(`#${id} .panel-header`),
),
{ ...grab, id: PANEL_ID },
);
if (onHeader) break;
await new Promise((resolve) => setTimeout(resolve, 500));
grab = await headerPoint();
}
await drag(grab, -200, -100);
const lifted = await readPanel();
const pressed = await page.evaluate(() => window.__qaPressBox);
assert.equal(lifted.floating, true, 'a header drag lifts the panel out');
assert.equal(
lifted.floating,
true,
`a header drag lifts the panel out (pressed ${grab.x},${grab.y} on ${pressed?.target}, in header: ${pressed?.inHeader}; panel docked at ${docked.top}, at press ${pressed?.top})`,
);
assert.equal(
lifted.collapsed,
false,