Visual QA Testing using Opkey

What is Visual QA Testing?Visual QA Testing can be described as the process of inspecting the user interface of a web application and ensuring it is presented as required. The main objective of the Visual QA Testing is to find visual errors like misalignment of objects, layout, font, etc. Visual QA Testing helps user to verify the web content (charts, graphs, dashboards, etc.) on a web page, which makes it worthwhile for a website having high graphical functionality.

‍Visual QA Testing using Opkey:Opkey is now capable of testing & analyzing visual quality of the websites. It has now been integrated with few Visual QA specific keywords which help in automated testing of look & feel of responsive websites & different browser sizes. You just need to define your own tags for devices and sizes while using these keywords to write checks for each element on a page.

Visual Testing specific Opkey keywords are as follows:

(1) VisualCheckPointSetting (Used to set prerequisites for visual QA)

(2) VisualCheckPointForObjects (Used to create and compare different layout among objects)

(3) VisualCheckPointForPage (Used to compare the page image by breaking image into given numbers of rows and columns)

Now, you can use these keywords in Test Case in Opkey. Before using these Opkey keywords you must ensure that you have fetched all the required objects of the web application to be tested. Now, you can create a Test Case by using these keywords and provide required object/data input argument.

1. VisualCheckPointSetting

This keyword is used to set prerequisites for visual QA. It doesn’t take any object input argument but it takes some data input arguments as described below.

Data Input Arguments:SpecFileName - Provide the name of File to be created with .spec file extension. It will also create a Folder with the same name which will contain all the fetched objects in objects sub-folder. It also contains a full web page image within pageimages sub-folder.

SpecFolderPath - Create a new folder and provide the folder path.

Platform - Provide platform name for which you are performing test such as Desktop, Mobile or Tablet.

Approximation Range - Provide the range of visual checkpoints which can be ignored. Beyond the approximation range, they will be considered as errors (bugs).

2. VisualCheckPointForObjects

This keyword is used to create and compare different layout among objects. It takes up to 10 objects input arguments. It also takes some data input arguments as described below.

Data Input Arguments:

SpecName - Provide the SpecName which collect information about the fetched objects within the created SpecFile.

SpecFolderPath - Provide path of the created folder. It is optional; if you don’t provide SpecFolderPath, it takes path of the folder given with earlier keyword, VisualCheckPointSetting.

3. VisualCheckPointForPage

This is Sikuli plugin keyword which is used to compare the page image by breaking an image into given numbers of rows and columns. It doesn’t take any objects input arguments. It also takes some data input arguments as described below.

First up, it fetches a full image of the web page and saves it. At runtime, it fetches web images and break as per given rows and columns and then compares these images one by one with the earlier fetched image.

Data Input Arguments:

ImageName - Provide the name of image to be created.

ShouldOverlay - Provide Yes/No. Yes: Checked; No: Unchecked.

If Yes then both compared images will overlay each other, if No then compared images will not overlay each other.

NumberofRows - Provide the no of rows into which image has to be broken.

NumberofColumns - Provide the no of columns into which image has to be broken.

For details about Visual QA Testing, kindly refer Opkey Help section: Visual QA Testing in Opkey

Author

Radhe Shyam Prajapati