33 lines
1.6 KiB
JavaScript
33 lines
1.6 KiB
JavaScript
import { chromium } from 'playwright';
|
|
const browser = await chromium.launch();
|
|
const page = await browser.newPage({ viewport: { width: 1280, height: 950 } });
|
|
await page.goto('http://localhost:5181/en/weather/week/berlin/', { waitUntil: 'load', timeout: 120000 });
|
|
await page.waitForTimeout(12000);
|
|
|
|
const info = await page.evaluate(() => {
|
|
const btn = document.querySelector('[data-slot="select-trigger"], button.group.min-h-12') ||
|
|
[...document.querySelectorAll('button')].find((b) => b.className.includes('min-h-12'));
|
|
const card = document.querySelector('.strip-cell');
|
|
const cs = (el) => {
|
|
const s = getComputedStyle(el);
|
|
return { prop: s.transitionProperty, dur: s.transitionDuration, delay: s.transitionDelay };
|
|
};
|
|
return { button: btn ? cs(btn) : null, cardEl: card ? cs(card) : null, btnClass: btn?.className.slice(0, 120) };
|
|
});
|
|
console.log('BEFORE switch:', JSON.stringify(info, null, 1));
|
|
|
|
// flip the theme and watch when each element's background actually moves
|
|
await page.getByRole('button', { name: /^Theme: / }).click();
|
|
const samples = [];
|
|
for (let i = 0; i < 12; i++) {
|
|
samples.push(await page.evaluate(() => {
|
|
const btn = [...document.querySelectorAll('button')].find((b) => b.className.includes('min-h-12'));
|
|
const card = document.querySelector('.strip-cell');
|
|
const g = (el) => (el ? getComputedStyle(el).backgroundColor : null);
|
|
return { t: Math.round(performance.now() % 100000), btn: g(btn), card: g(card), dur: btn ? getComputedStyle(btn).transitionDuration : null };
|
|
}));
|
|
await page.waitForTimeout(60);
|
|
}
|
|
console.log(JSON.stringify(samples.map((s) => `${s.btn} | ${s.card} | ${s.dur}`), null, 1));
|
|
await browser.close();
|