Visual Analysis is a process of validating and analyzing the visual aspects of an application's UI to check if its contents and positions are identical. Testsigma also analyzes if the elements are identically aligned and have identical shapes and sizes considering its font, color, or image while comparing two images.


PREREQUISITE FOR VISUAL ANALYSIS

1. Make Sure you have enabled the Visual Analysis toggle in preferences(Configuration > preferences > Visual Analysis).


2. It is mandatory to enable Screenshots for all steps while creating a test plan.


TERMINOLOGY

Baseline Image: Base image is the image that we generate in the first run in order to compare it with the other images. The base image is considered as the standard while comparing it with images in the next results.
Current Image: The recently generated image from the last run is considered as the current image. We can also make the current image as a base image, which we will be discussing further.


STEPS TO PERFORM VISUAL ANALYSIS

Once we make sure we meet the prerequisites, we need to run the test plan once to generate the baseline Image for visual comparison. Subsequent runs actually do the visual comparison.


1. Click on "View Reports" as shown below or navigate to the Run Results page.


2. In the test step results, we can see the "eye" icon in yellow/green color. The "Yellow" color represents that there is a visual difference in the step. Here is the image showing it:
In case there is no visual difference between the base image and the current image. The test step would have a "Green" eye as shown below:
Once you click on the "eye" icon you will be navigated to the below page where the comparison is done.


COMPARING IMAGES

Once the eye icon is clicked, we will be able to see the visual change in red color. Here is how it looks:

HIDE VISUAL DIFFERENCES
The specific button is used to hind the visual differences so that the user can see the differences between the base image and the current image manually to get a better view and for better analysis.


NOTE: We show the visual differences based on Image, text, color, and pixel location. A minute change in the location can also result in differences.
Welcome to the era of #SmartTestAutomation