Visual testing is a fundamental component of UI Testing where the looks of a given portion of the screen are compared to a reference image to determine if it changed from a previous execution.
In your UI tests you can add a call to the verifyScreenshot method whenever you want to perform a visual comparison:
&app.verifyScreenshot("img01", "&someControl")
When this test runs, it does a few things under the hood.
First and foremost, it is necessary to set up a visual testing store and configure the Visual Testing Repository URL property appropriately.
You can find the information on the Knowledge Base in the next section.
A "reference image" is identified by:
- a project code, that is, the application's identifier
- a test code, given by the UI Test object name
- a reference code, the first parameter of the verifyScreenshot method
- the platform (Android or iOS)
The first time the test runs there is no image on the repository and so the test will send the corresponding screenshot to the server via a REST call.
This first run then saves that image as the reference image for that test case.
Important: make sure the captured screenshot is the desired one, or the following executions will compare against the wrong image.
The first execution always succeeds.
The next time the test runs it will retrieve the reference image from the server and compare it with the local screenshot (taken during the execution of the test).
The comparison is performed bit-by-bit, so only identical images make the test pass.
VisualTestingStore
Make sure you deploy the generated programs to a server that can be found by the running tests, and that it is under HTTPS.
Although it is available in GeneXus 17 upgrade 7 or higher via the verifyScreenshot method, the feature is in Beta and requires further improvements.