A screenshot comparison fails on a one-pixel difference, and font rendering differs between a laptop and a CI runner.
// in the container, not on the host
module.exports = {
onBeforeScript: 'puppet/onBefore.js',
dockerCommandTemplate:
'docker run --rm -v {cwd}:/src backstopjs/backstopjs:6.0.2 {backstopCommand}',
misMatchThreshold: 0.1,
}
// and the fonts must be IN the image, not loaded from
// a CDN — a slow font swap is a diff on every run.
Running the browser in a pinned container is the only reliable answer, since the host’s fonts, device pixel ratio and rendering engine version all affect the output. Self-hosting the fonts in the test image removes the timing dependency that causes intermittent diffs. A non-zero mismatch threshold is a compromise that hides real one-pixel regressions, and a threshold of zero with a stable environment is achievable and better.