QA
Screenshots looked fine at the top of the page. The bottom was hundreds of pixels off.
Pixel diffs are noisy when content and images differ, and small spacing errors add up quietly on long pages. A template can look correct above the fold and be hundreds of pixels out by the footer.
Measure structure, not pixels
I wrote a small Playwright tool that records the position and height of every top-level section on two versions of a page, in rem, and prints them side by side. Drift becomes a column of numbers instead of a feeling.
- Missing or reordered sections show up immediately
- Cumulative spacing errors appear as a growing offset
- Fixes are verified by the next run, not by eye
Result
One service template was 254rem longer than its reference. Fixing shared spacing rules — not adding one-off margins — and restoring missing sections brought the difference to about 5.7rem.