Making Front-end Testing Easier using Visual Regression

Session Details

UI is all about unexpected changes, and CSS is to blame. Once we add a new class or CSS rule on one page, it will almost certainly override something on a completely different page. Some time this can lead to the breakdown of other page.

So it’s extremely difficult for the QA's to cover each and everything on devices such as mobile, tablet and desktop. That's where visual regression testing comes to the rescue: it allows you to compare 2 sets of screenshots and find the differences between them.

Our story starts with a brief introduction to Visual regression, a quick look at the installation of BackstopJS and how BackstopJS is answer to our problems followed by a Live Demo.

Session Outline:
1. What is Visual Regression?  In this Part, we give you a brief Introduction about the  Visual Regression.
2. Why It’s Important? How a Front-end Testing Is Easier with the right Automation.
3. Visual Regression Tools: Currently available tools in the market for Visual Regression
4. Working principle of Backstop JS
5. Pre-requisite and Installation of Backstop JS
6. How to handle Challenges in Visual Regression such as Handling dynamic text, images, animations, etc
7. Demo - Examples:

Experience Level