The dashboard we are baselining has a "last updated HH:MM:SS" line in the header. Every single run differs by that strip of pixels, so the baseline is red forever and the diff is a tiny grey smear in the corner.
I do not want to delete the scenario and I do not want to raise the tolerance until the whole layout can move without anyone noticing. What is the intended way to say "ignore this box"?
Accepted answer
screenshots.mask. It is a list of selectors that get painted over before the pixels are compared, and it applies to the baseline comparison as well as to the narrated step captures:
screenshots:
policy:
default: on-failure
'@visual': visual
mask:
- '[data-test="last-updated"]'
viewport: { width: 1280, height: 720 }Two things to know about it.
It is project-wide, not per scenario. That reads like a limitation and usually is not: a region that is unstable in the baseline scenario is unstable in every other capture too, and a masked box in a step screenshot is more honest than a box that says 14:03:07 in an artefact somebody reads at 09:00 the next morning.
The strings are raw CSS selectors handed to the page — the role-and-name locator priority does not apply here, because you are describing a rectangle, not an element a user interacts with. Pick something stable; a test id is the usual right answer.
More in Screenshots and visual testing.
Have a different question? Ask it.