Skip to content

feat(vrt): add Canvas2D visual regression tests#804

Open
wouterlucas wants to merge 3 commits into
mainfrom
feat/canvas-visual-regression
Open

feat(vrt): add Canvas2D visual regression tests#804
wouterlucas wants to merge 3 commits into
mainfrom
feat/canvas-visual-regression

Conversation

@wouterlucas

Copy link
Copy Markdown
Contributor
  • visual-regression: add --renderMode flag (webgl|canvas|all) to run VRT against Canvas2D renderer, storing snapshots in a separate chromium-ci-canvas/ subdirectory to keep them isolated from WebGL
  • CI (tests.yml): pass --renderMode all so both renderers are always exercised on every PR and merge group check
  • examples/index.ts: wrap per-test automation() calls in try/catch so an unsupported feature in one test (e.g. SDF text in canvas mode) cannot block doneTests() and hang the entire runner
  • certified-snapshots/chromium-ci-canvas: 122 baseline canvas snapshots captured and committed

- visual-regression: add --renderMode flag (webgl|canvas|all) to run
  VRT against Canvas2D renderer, storing snapshots in a separate
  chromium-ci-canvas/ subdirectory to keep them isolated from WebGL
- CI (tests.yml): pass --renderMode all so both renderers are always
  exercised on every PR and merge group check
- examples/index.ts: wrap per-test automation() calls in try/catch so
  an unsupported feature in one test (e.g. SDF text in canvas mode)
  cannot block doneTests() and hang the entire runner
- certified-snapshots/chromium-ci-canvas: 122 baseline canvas snapshots
  captured and committed
@wouterlucas wouterlucas requested a review from jfboeve June 4, 2026 16:35
@wouterlucas

Copy link
Copy Markdown
Contributor Author

guess we got to check a couple of these @jfboeve 😅

Relying on pnpm arg threading through two script levels to pass
--renderMode all was unreliable. Instead, make the renderMode default
context-aware: 'all' in CI, 'webgl' locally. The workflow step needs
no extra arguments.
Allow up to 10 pixels to differ before failing (default). Absorbs
sub-pixel rounding differences between macOS and Linux headless
Chromium without masking real layout regressions.

- compareBuffers: accepts maxDiffPixels param (default 10)
- compareSnapshot: threads maxDiffPixels from SnapshotOptions
- SnapshotOptions (both snapshot.ts and ExampleSettings.ts): adds
  optional maxDiffPixels field so individual tests can tighten or
  loosen the tolerance as needed
- failure reason now reports both actual count and allowed max
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant