svelte-kit-vice/scripts/probe-cross-component.ts

import { chromium } from 'playwright';
const BASE = process.env.BASE_URL ?? 'http://localhost:5173';
const b = await chromium.launch();
const ctx = await b.newContext({ viewport: { width: 1280, height: 900 } });
const p = await ctx.newPage();

// Quick check across components that depend on palette tokens
const probes = [
	{ route: '/uix/components/button', sel: '[data-button]', label: 'button (default)' },
	{ route: '/uix/components/badge', sel: '[data-badge]', label: 'badge (default)' },
	{ route: '/uix/components/switch', sel: '[data-switch]', label: 'switch (default)' }
];

for (const pr of probes) {
	try {
		await p.goto(BASE + pr.route, { waitUntil: 'domcontentloaded', timeout: 15000 });
		await p.waitForTimeout(400);
		const data = await p
			.locator(pr.sel)
			.first()
			.evaluate((el: Element) => ({
				dataColor: el.getAttribute('data-color'),
				dataVariant: el.getAttribute('data-variant'),
				bg: getComputedStyle(el).backgroundColor,
				borderColor: getComputedStyle(el).borderColor
			}));
		console.log(pr.label, JSON.stringify(data));
	} catch (e: any) {
		console.log(pr.label, 'ERR', e.message?.slice(0, 100));
	}
}
await b.close();