Testing

The suite exercises every component across the combinations of its optional features, in a real browser. It has already caught real bugs, from missing accessible names to a crash when identical tags were added, so it is part of how the library is built, not an afterthought.

How it works

1. Specs (src/harness/specs.ts) list, for each component, every optional feature and the values it takes: variants, sizes, icons, loading, disabled, error, async, virtual, filterable…
2. Combinations are enumerated by src/harness/combos.ts: the full cartesian product when the space is small, otherwise an all-pairs cover (every pair of option values appears together at least once).
3. Builders (src/harness/components.ts) turn each symbolic combination into real props and snippets and mount it in a harness page. Switching component is a function call, not a navigation, so thousands of cases run in minutes.
4. Playwright Test drives real Chromium: real layout, focus, pointer and keyboard events.

What runs against every combination

• It mounts and renders, with no console errors and no Svelte warnings (enforced by a fixture on every test).
• An accessibility and structure audit: names, ARIA references, unique ids, no hidden focusables, no nested interactive controls, required state attributes.

Behavioural specs

On top of the sweep, each family has specs that check the features actually work when combined: typing, keyboard maps, popovers, clamping and parsing, selection, async races, virtual windows, drag and resize, geometry of joined input groups, SVG validity of every chart, edge-routing that never crosses a node, and more. Pure helpers (date, time, duration and colour parsing; graph routing and layout) have table-driven unit tests.

Run it

npm run test                      # everything
ONLY=Select,Combobox npm run test # selected components (matrix and behaviour)
npx playwright test tests/groups.spec.ts

The dev server is started for you on port 5199. Set PW_CHROMIUM to use a specific browser binary and PW_WORKERS to change parallelism.

Adding a component

1. Add its options to specs.ts and a builder to components.ts. It is then covered by the matrix automatically.
2. Add a behavioural spec for the features that need interaction.
3. Run npm run docs to regenerate the API reference.