[tmashara]

Closes #150

--browser webkit (or browser: "webkit" in the config) shoots both sides in Playwright's WebKit, for CSS that only Safari reads differently. The prefix check from #155 covers the issue's own case, which no WebKit pixel shows. This option covers the cases that do render differently. The new box-decoration-break fixture is one: an autofix drops -webkit-box-decoration-break, which gives pixel parity in Chromium and a diff in WebKit.

What changes

• Capture. WebKit has no CDP, so grab() falls back to page.screenshot({ fullPage: true, clip }). Tiling at 16,384px is kept, so pageShot and captureTiled are unchanged. WebKit holds document.fonts.ready, which its screenshot waits on, until the load event; a stalled frame never fires that, so the page is window.stop()ped before the shot when it is still loading.
• --computed. snapshotStates falls back to the plain walk, because forcing :hover/:focus-visible needs CDP. The run prints one line saying so. Rule coverage and the prefix check are plain JS and work as on Chromium.
• Config. browser is optional in ResolvedConfig (like lottieFrame), so a Chromium run's config hash, and with it --rerun-failed, is unchanged. A WebKit run defaults to renderdiff-out-webkit and renderdiff.accepted.webkit.json, so its pixel hashes never prune Chromium's entries. merge refuses to mix engines. The cache key already includes the browser.
• Action and CI. The Action gets a browser input (install, cache key, flag, accepted file name) and its self-test gains a WebKit step. CI installs chromium webkit.
• Not done. GIFs aren't frozen in WebKit: there's no image-animation setting, so they show as unstable and unmeasured, which is documented. No isMobile, and no running both engines in one run.

Chromium stays byte-identical

Every WebKit branch is gated on the engine. I ran the whole corpus (60 routes × 2 widths) on main and on this branch, then main against main as a control. In both comparisons the only differences are the fixtures that vary per load by design (clock, bistable, unsettled, drifting) and the fixture server's port inside failed-asset URLs and error text. Every other PNG and results.json entry is byte-identical.

Tests

• tests/visual/webkit.test.ts:
  • box-decoration-break: parity in Chromium, a diff in WebKit;
  • flex-vs-grid scores 100% and color doesn't;
  • tall is stitched to 18,000px;
  • stalled-frame is shot in normal time;
  • animated is unstable, not a diff;
  • --computed works without states and prints the note;
  • --accept writes the .webkit file and leaves Chromium's alone;
  • the default out dir is renderdiff-out-webkit.
• Unit: --browser and config validation; merge refusing mixed engines.
• typecheck, lint, format:check and npm test pass, as do the webkit, computed and guardrails visual files. Before the rebase, the controls, equivalence and accepted visual files passed too.

🤖 Generated with Claude Code