How do you tell if a change you made to your website has unintended side effects? Security updates should rarely result in anything changing visually, but how can you be sure? Visual regression testing automates the comparison process by taking screenshots of two URLs and comparing them. You can view a report that highlights the differences and use the pass/fail result to make decisions. In this workshop, we will use the BackstopJS visual regression tool locally, via Node JS, to automate visual QA. We will also learn how to scale and automate these tests across multiple sites and URLs. Key takeaways: - Writing tests can be easy. - Tests will dramatically improve the quality of my work and build confidence that I’m not introducing bugs. - BackstopJS is an easy to learn solution for detecting visual differences between two versions of a site. I've presented this at TCDrupal 2019, Flyover Camp 2019, Webcon 2019 (full-day workshop), MidCamp 2019, DCATL 2018 (half-day workshop), Drupal EU 2018 (half-day workshop), and Texas Camp 2018 (full-day workshop).
David Needham is a Developer Advocate at Pantheon where he focuses on developer education and training. When he's not blogging about productivity at davidneedham.me or speaking at conferences, you can probably find him with his bicycle-loving family playing board games in Champaign, IL. David has a heart for helping beginners to feel empowered and grow. He uses his public speaking experience to share topics clearly and concisely. Topics range from introductions to fundamental building blocks to soft skills like productivity and public speaking. David has presented formal presentations on Drupal and WordPress dozens of times for thousands of people, including DrupalCons at Chicago, London, Denver, Munich, Portland, Los Angeles, New Orleans, Vienna, Nashville, Darmstadt, and Seattle; as well lots of WordCamps, including WCEU Belgrade, Berlin, and many more.