ilia
cfe1cf3922
Tested all four variants in browser — only active layer body visible while tabs stay staggered; scroll covers previous layers correctly. Co-authored-by: Cursor <cursoragent@cursor.com>
35 lines
1.2 KiB
JavaScript
35 lines
1.2 KiB
JavaScript
import { chromium } from 'playwright';
|
|
|
|
const browser = await chromium.launch({ headless: true });
|
|
const page = await browser.newPage({ viewport: { width: 1280, height: 800 } });
|
|
await page.goto('http://localhost:5176/stack-folder/', { waitUntil: 'networkidle' });
|
|
|
|
for (const y of [0, 400, 800, 1200]) {
|
|
await page.evaluate((sy) => window.scrollTo(0, sy), y);
|
|
await page.waitForTimeout(150);
|
|
const data = await page.evaluate(() => {
|
|
return [...document.querySelectorAll('.folder')].map((f, i) => {
|
|
const cs = getComputedStyle(f);
|
|
const r = f.getBoundingClientRect();
|
|
const body = f.querySelector('.body');
|
|
const br = body.getBoundingClientRect();
|
|
const sec = f.closest('.scroll-section');
|
|
const sr = sec.getBoundingClientRect();
|
|
return {
|
|
i,
|
|
folderTop: Math.round(r.top),
|
|
bodyTop: Math.round(br.top),
|
|
position: cs.position,
|
|
top: cs.top,
|
|
zIndex: f.style.zIndex || cs.zIndex,
|
|
sectionTop: Math.round(sr.top),
|
|
sectionBottom: Math.round(sr.bottom),
|
|
sectionH: Math.round(sr.height),
|
|
};
|
|
});
|
|
});
|
|
console.log('scroll', y, JSON.stringify(data.filter((d) => d.sectionBottom > 0 && d.sectionTop < 800), null, 2));
|
|
}
|
|
|
|
await browser.close();
|