feat(web): add dark mode and reduced motion emulation
Merged
RE
13d ago+719+719+012345678901234567890123456789-15-15-01234567890123456789
Part 1 of #1020.
- Add
web({ colorScheme, reducedMotion })andbrowser.emulateMedia()so tests can exercise the app's CSS media rules andmatchMedia. - Apply settings before navigation and retain test changes through restarts, state resets, and CDP reconnects.
- Add tests, API documentation, and a minor release changeset.
// Defaults for every test
engine: web({ colorScheme: 'dark', reducedMotion: 'reduce' })
// Change one test before the page opens
await browser.emulateMedia({ reducedMotion: 'reduce' });
await app.open('/');
Verified
Ran it locally: yes
- Built CLI on the testbed:
pnpm --filter @e2e-dev/testbed test. The media test reads the page's own CSS rules, changes preferences on the open page, and checks them after restart.
✓ tests/browser.e2e.ts (7 tests)
Tests 78 passed | 1 skipped (79)
- Real Chromium integration tests cover configuration defaults, partial updates, first-page load, state resets, CDP reconnects, and invalid values.
pnpm checkpassed. Web engine: 553 tests passed. Web benchmark: 91 tests passed.