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.
svelte-kit-vice/scripts/__table-selected.ts

39 lines
1.8 KiB

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();

Powered by TurnKey Linux.