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.
Andrew Knight, also known as “Pandy,” is the Automation Panda. He’s a software quality champion who loves to help people build better quality software. Currently, he works as the Senior Director of Product Management at Cycle Labs, focusing on building an excellent test automation platform for enterprise systems. Previously, Pandy spent a decade as a SDET building solutions to testing problems at various tech companies. He also previously led Developer Relations and Test Automation University at Applitools. As an avid supporter of open source software, Pandy is a Playwright Ambassador as well as the lead developer for Boa Constrictor, the .NET Screenplay Pattern. On the side, he is writing a book on software testing with Manning Publications. Apart from software, Pandy spends time with his family, his French Bulldog, and his vintage Volkswagens. Check out his tech blog at AutomationPanda.com, and follow him on Twitter at @AutomationPanda.