test(transparency): paint body background in fixture so it actually fails on the base SHA

Per Miguel's review: the previous fixture had no body / root background, so it
passed against both the buggy and fixed code. The fix this PR makes (the
initTransparentBackground stylesheet injection in initializeSession) only
matters when a composition paints over the CDP default-background-color
override — exactly what we tell users not to do, but exactly what a
regression test must do.

Reproduced locally:

- base SHA (2935be6): pixel (10,10) decodes as rgba [16,16,16,255]
  (opaque #111 body bg leaks through the pre-navigation override that
  Chrome resets on goto)
- this head: pixel (10,10) decodes as rgba [0,0,0,0]
  (initTransparentBackground injects [data-composition-id]{background:transparent !important}
  AFTER navigation, force-overriding the body bg)

The pixel-level assertions in transparency-test.ts are unchanged — they
already require alpha=0 at (10,10). With the body bg painted, that
assertion now fails on any code path that doesn't actually preserve alpha
end-to-end.
This commit is contained in:
Youssef Toufik
2026-04-27 21:05:56 +01:00
parent fe017b48c7
commit 9e05322531
@@ -2,17 +2,26 @@
<html>
<head>
<style>
/*
We DELIBERATELY paint a non-transparent body background here to
exercise the regression this PR fixes. The pre-navigation
Emulation.setDefaultBackgroundColorOverride that the engine used
to set is overridden by any `body { background: ... }` rule, so
on the buggy code path the captured PNG's "transparent" pixels
decode as opaque #111 (rgba [17, 17, 17, 255]).
The fix injects an `[data-composition-id]{background:transparent !important}`
stylesheet via initTransparentBackground() AFTER navigation, which
force-overrides this body background and produces a real alpha
channel — pixels outside the .card decode as rgba [0, 0, 0, 0].
If the test passes against this fixture, alpha is genuinely making
it through end-to-end.
*/
html,
body {
margin: 0;
padding: 0;
background: #111;
}
/*
Intentionally NO body / #root background — the alpha pipeline forces
the page background fully transparent. We DO set a background on
.card to verify that *inner* element backgrounds survive the
force-transparent override.
*/
.card {
position: absolute;
left: 50px;