You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
39 lines
1.8 KiB
39 lines
1.8 KiB
2 months ago
|
import { chromium } from 'playwright';
|
||
|
|
const browser = await chromium.launch();
|
||
|
|
const page = await browser.newPage({ viewport: { width: 1440, height: 1000 } });
|
||
|
|
await page.goto('http://localhost:5180/uix/components/table', { waitUntil: 'networkidle' });
|
||
|
|
await page.waitForTimeout(400);
|
||
|
|
const out = await page.evaluate(() => {
|
||
|
|
const root = document.querySelector('[data-table-root]') as HTMLElement;
|
||
|
|
const row = root.querySelector('[data-table-body] [data-table-row]') as HTMLElement;
|
||
|
|
row.setAttribute('data-selected', '');
|
||
|
|
const res: Record<string, unknown> = { archetype: row.getAttribute('data-archetype') };
|
||
|
|
// ¿quién gana el `color` de la fila seleccionada?
|
||
|
|
const winners: string[] = [];
|
||
|
|
const walk = (rules: CSSRuleList | undefined) => {
|
||
|
|
for (const r of rules ?? []) {
|
||
|
|
const any = r as CSSStyleRule & { cssRules?: CSSRuleList };
|
||
|
|
if (any.cssRules) walk(any.cssRules);
|
||
|
|
if (!any.selectorText || !any.style?.color) continue;
|
||
|
|
try {
|
||
|
|
if (row.matches(any.selectorText)) winners.push(`${any.selectorText.slice(0, 70)} => ${any.style.color}`);
|
||
|
|
} catch { /* selector no evaluable */ }
|
||
|
|
}
|
||
|
|
};
|
||
|
|
for (const sh of document.styleSheets) { try { walk(sh.cssRules) } catch { res.corsSheets = (res.corsSheets as number ?? 0) + 1 } }
|
||
|
|
res.reglasColor = winners;
|
||
|
|
res.computed = getComputedStyle(row).color;
|
||
|
|
// filas pares con striped
|
||
|
|
root.setAttribute('data-striped', '');
|
||
|
|
const even = root.querySelector('[data-table-body] [data-table-row]:nth-of-type(even)') as HTMLElement;
|
||
|
|
res.filaPar = !!even;
|
||
|
|
if (even) {
|
||
|
|
const b = getComputedStyle(even).backgroundColor;
|
||
|
|
root.style.setProperty('--table-striped-row-bg', 'rgb(1, 2, 3)');
|
||
|
|
res.stripedAlcanza = getComputedStyle(even).backgroundColor !== b;
|
||
|
|
}
|
||
|
|
return res;
|
||
|
|
});
|
||
|
|
console.log(JSON.stringify(out, null, 1));
|
||
|
|
await browser.close();
|