33 lines
2.1 KiB
JavaScript
33 lines
2.1 KiB
JavaScript
const { test, expect } = require('@playwright/test');
|
|
const { readFileSync } = require('node:fs');
|
|
const { openClassic, showPlayingFixture } = require('./helpers/classic-fixture');
|
|
const phoneCss = readFileSync('frontend/styles.css', 'utf8').replaceAll('(display-mode: standalone)', '(min-width: 0px)').replaceAll('env(safe-area-inset-bottom)', '34px');
|
|
|
|
// Glass Stage section rail floats centred above the mini player and stays put while the page scrolls.
|
|
test('glass rail floats above the mini player and ignores scroll', async ({ page }) => {
|
|
await page.setViewportSize({ width: 390, height: 844 });
|
|
await page.route('**/styles.css', r => r.fulfill({ contentType: 'text/css', body: phoneCss }));
|
|
await openClassic(page, { populated: true, standalone: true, settings: { autoPreload: false } });
|
|
await showPlayingFixture(page);
|
|
await page.evaluate(() => {
|
|
data.settings.layout = 'glass-stage'; applyAppearance();
|
|
document.getElementById('miniBar').classList.remove('hidden'); updateBottomChrome(); SectionRail.refresh();
|
|
});
|
|
await page.waitForTimeout(300);
|
|
const at = () => page.evaluate(() => {
|
|
const r = document.getElementById('sectionRail').getBoundingClientRect(), m = document.getElementById('miniBar').getBoundingClientRect();
|
|
return { top: r.top, bottom: r.bottom, center: (r.left + r.right) / 2, miniTop: m.top, parent: document.getElementById('sectionRail').parentElement.id, pos: getComputedStyle(document.getElementById('sectionRail')).position };
|
|
});
|
|
const a = await at();
|
|
expect(a.pos).toBe('fixed');
|
|
expect(a.parent).not.toBe('listPane');
|
|
expect(Math.abs(a.center - 195)).toBeLessThan(2);
|
|
expect(a.bottom).toBeLessThanOrEqual(a.miniTop);
|
|
await page.screenshot({ path: process.env.SHOT_DIR ? `${process.env.SHOT_DIR}/rail-a.png` : undefined });
|
|
await page.evaluate(() => { for (const el of [document.scrollingElement, ...document.querySelectorAll('.body,#listPane,.player-pane')]) el && (el.scrollTop += 600); });
|
|
await page.waitForTimeout(200);
|
|
const b = await at();
|
|
expect(Math.abs(b.top - a.top)).toBeLessThan(1);
|
|
await page.screenshot({ path: process.env.SHOT_DIR ? `${process.env.SHOT_DIR}/rail-b.png` : undefined });
|
|
});
|