backstopJS

Official Detailed Documentation
Quick guide

BackstopJS automates visual regression testing of your responsive web UI by comparing DOM screenshots over time.
And here's a quick basic guide how it works and how we can use it in our workflows.

How it works:

• BackstopJS takes 2 inputs, can be images or urls, that are compared based on user defined Criteria.
• you can also run the same tests in Docker, avoding this way any dependencies issues
• the final restult (after 2 images/sites were compared) will look something like this. And there is also an option to adjust the Match Threshold

How we can use it:

• we can try to experiment with it over time
• first thing where we can apply it, are Otter releases, because most of the Gutenberg demos from demosites.io are Otter dependent. Basically have a Snapshot of how a reference demo should look, and before each release compare that with the new version. This way we can avoid issues like this one, another one, or basic things like icon/images missing/not loading.