fix: keep portfolio panels above journey world

This commit is contained in:
2026-09-02 06:09:44 +03:00
parent 77895c01ff
commit eb672bd664
2 changed files with 41 additions and 0 deletions

View File

@@ -41,6 +41,43 @@ test('keeps the desktop identity and navigation in a paint layer above the world
expect(layers.headerOpacity).toBeGreaterThanOrEqual(0.94);
});
test('keeps a scrolled content panel in a geometry-safe paint layer above the world', async ({ page, distUrl }) => {
await page.setViewportSize({ width: 1440, height: 900 });
await page.goto(distUrl, { waitUntil: 'domcontentloaded' });
await page.locator('nav a[href="#profile"]').click();
const layers = await page.evaluate(() => {
const world = document.querySelector<HTMLElement>('.journey-world');
const main = document.querySelector<HTMLElement>('.portfolio-main');
const panel = document.querySelector<HTMLElement>('#profile');
const heading = document.querySelector<HTMLElement>('#profile-heading');
if (!world || !main || !panel || !heading) throw new Error('Missing scrolled panel structure');
const mainStyle = getComputedStyle(main);
const panelStyle = getComputedStyle(panel);
const headingRect = heading.getBoundingClientRect();
return {
worldZ: Number(getComputedStyle(world).zIndex),
mainIsolation: mainStyle.isolation,
mainPosition: mainStyle.position,
headingVisible:
headingRect.width > 0
&& headingRect.height > 0
&& headingRect.bottom > 0
&& headingRect.top < window.innerHeight,
panelOpacity: Number.parseFloat(panelStyle.backgroundColor.match(/[\d.]+(?=\))/gu)?.at(-1) ?? '1'),
};
});
expect(layers).toMatchObject({
worldZ: 0,
mainIsolation: 'isolate',
mainPosition: 'static',
headingVisible: true,
});
expect(layers.panelOpacity).toBeGreaterThanOrEqual(0.94);
await expect(page).toHaveURL(`${distUrl}/#profile`);
});
test('provides native motion and quality controls with visible state', async ({ page, distUrl }) => {
await page.goto(distUrl, { waitUntil: 'domcontentloaded' });