Summary
Add first-class API support for changing the browser viewport during a css-expect runtime so tests can run against multiple dimensions without creating separate runtimes.
Context
createCssExpect() already accepts an initial viewport option and passes it to Playwright when creating the browser context. That supports starting a test run at a specific size, but the runtime does not currently expose a way to resize the existing page/context between expectation groups.
This would let users express flows such as:
const css = await createCssExpect({ css });
await css.viewport({ width: 1440, height: 900 });
await css.function("--space", []).as("margin-left").equals("24px");
await css.viewport({ width: 390, height: 844 });
await css.function("--space", []).as("margin-left").equals("16px");
Proposed API
Expose a runtime method such as:
await css.viewport({ width: 390, height: 844 });
Possible naming alternatives: setViewport(), resize(), or atViewport().
Acceptance criteria
- Users can resize the active browser page after
createCssExpect() without recreating the runtime.
- Existing
viewport creation option continues to work.
- Runtime tests cover initial viewport and runtime resize behavior.
- README documents multi-viewport usage with desktop and mobile examples.
- Diagnostics include enough viewport context to debug failures that differ by size, if practical.
Notes
Implementation likely maps to Playwright page resizing, while preserving the current private runtime/page encapsulation.
Summary
Add first-class API support for changing the browser viewport during a css-expect runtime so tests can run against multiple dimensions without creating separate runtimes.
Context
createCssExpect()already accepts an initialviewportoption and passes it to Playwright when creating the browser context. That supports starting a test run at a specific size, but the runtime does not currently expose a way to resize the existing page/context between expectation groups.This would let users express flows such as:
Proposed API
Expose a runtime method such as:
Possible naming alternatives:
setViewport(),resize(), oratViewport().Acceptance criteria
createCssExpect()without recreating the runtime.viewportcreation option continues to work.Notes
Implementation likely maps to Playwright page resizing, while preserving the current private runtime/page encapsulation.