pcbjam/tests/web/theme.spec.ts
Gergő Törcsvári 21a96b0440
comments-ux: figma bubble pins, floating panel, seen/reactions/mentions UI, theme follow (0001 A–E + 0002)
- GAL pin = one closed polygon: round body, squared-off bottom-left corner
  ON the anchor; PIN gains unread (accent ring); tuner knobs; shipped
  defaults r9/ring4/alpha.9. DOM hit/highlight sized+offset from a LIVE
  pin-geometry radius store the tuner feeds.
- Floating comments panel: draggable (shared useDraggablePanel with
  always-onscreen restore; overlay FAB retrofitted), collapsible to header,
  header carries add/show-hide/mark-all; unread badges (rose on mention).
- Reactions (emoji-mart lazy, quick-row) + @-mention autocomplete
  (MentionInput; backend roster with presence/author fallback).
- Theme: ?theme= > storage > OS, no-flash boot, toggles (HomePage + overlay
  View row), boot-seeded pcbjam-dark schematic colors + kicadSetColorTheme /
  kicadSetDarkChrome bridges (canvas + wx chrome live flip), light/dark
  variants across all overlay surfaces.
- e2e: panel/seen/reactions/mentions/theme specs + resize-spec geometry;
  bumps pcbjam-shared (flat-key seen/reactions + listCollaborators) and
  wxwidgets (dark chrome) pointers.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01HLwn1toiNKi1MgxGKnZTes
2026-07-24 13:21:22 +02:00

36 lines
1.7 KiB
TypeScript

import { test, expect } from '@playwright/test';
/**
* Standalone theme follow e2e (comments-ux 0002): resolution precedence
* (?theme= param > storage > OS), no-flash application before first paint,
* persistence across a param-less reload, and the shell toggle. Kept on the
* HOME page — no tool boot needed; the canvas half (seeded KiCad color theme
* + the kicadSetColorTheme bridge) is covered by unit seeding assertions and
* manual Firefox verification per the standalone UI workflow.
*/
test('?theme=dark applies before paint, persists, and the toggle flips it', async ({ page }) => {
await page.goto('/?theme=dark', { waitUntil: 'domcontentloaded' });
// The inline boot script ran before first paint — no React needed yet.
await expect(page.locator('html')).toHaveClass(/dark/);
// The param persisted; a param-less reload stays dark.
await page.goto('/');
await expect(page.locator('html')).toHaveClass(/dark/);
expect(await page.evaluate(() => localStorage.getItem('pcbjam-theme'))).toBe('dark');
// Shell toggle flips class + storage.
await page.getByTestId('theme-toggle').click();
await expect(page.locator('html')).not.toHaveClass(/dark/);
expect(await page.evaluate(() => localStorage.getItem('pcbjam-theme'))).toBe('light');
// A later ?theme= wins over the stored choice.
await page.goto('/?theme=dark', { waitUntil: 'domcontentloaded' });
await expect(page.locator('html')).toHaveClass(/dark/);
});
test('invalid ?theme= falls back to the stored/OS preference', async ({ page }) => {
await page.emulateMedia({ colorScheme: 'light' });
await page.goto('/?theme=purple', { waitUntil: 'domcontentloaded' });
await expect(page.locator('html')).not.toHaveClass(/dark/);
});