Automating Visual Tests with Cypress

In this workshop, we learn what "visual testing" is and how it's different from traditional functional testing. Essentially, a picture is worth a thousand assertions. We can take visual snapshots of our apps during automated tests and compare them over time. Any changes detected are flagged for testers to inspect. Good visual testing uses AI to flag significant things like missing elements instead of insignificant things like a 1-pixel shift. To demonstrate this, we will automate a test for an example web app using Cypress and JavaScript without and then with visual snapshots. For visual testing, we will use Applitools Eyes (free accounts). We will also run visual tests across multiple browser configurations using the Applitools Ultrafast Test Cloud.