Overview of design driven testing

Design driven testing (DDT) is a dynamic feature that leverages machine learning capabilities to enable you to start the testing phase in the early stages of development of web applications.

You can now provide wireframes or screen captures of a web application instead of the URL of the deployed application to configure them for testing. DDT recognizes UI controls on these images of the application designs that you have provided. You can validate the identified UI controls and also modify them if required in the design editor screen. If any of the controls are not identified, you can add such controls with an appropriate label. Since DDT uses machine learning capability, the accuracy improves through more iterations.

The applications configured with designs can be used to record tests in the Virtual Client window. After you record the tests, you can refine the test steps in the test editor. When the real application is deployed, you can run the tests. Also, if you run the tests with guided healing option enabled, you can replace the screen captures with the latest ones.

DDT accelerates testing activities by advancing the testing phase in a product release cycle.

Guidelines for using DDT:

  • You must use .jpg, .jpeg, or .png images of 1080*720 or higher resolution to upload designs of web applications. The total size of the uploaded images must not exceed 50 MB.

  • After the images are uploaded and processed by CDIS service(BE), the Design editor page displays the identified controls. You must then validate all the controls and the associated labels.

  • If any control not identified, then add it by selecting the correct control type.

  • If the Content field is empty for any of the identified controls, check whether the content is available under the Label category. You must not add the Content value manually if the associated Content is listed under Label.
  • Keep adding the designs iteratively to improve the accuracy of controls that are detected.

Standard task flow of design driven testing for Web UI tests

The standard task flow of design driven testing for web applications using Test UI is as follows.
S/N Task More information
1 Add the images of web application designs by using the Application Configuration page. Adding a web application design
2 Validate the UI controls that are identified, and then edit them as required. Editing a web application design
3 Upload more images, reorder the uploaded images, and delete the unwanted ones. Editing the web application configuration
4 Record Web UI tests by using the applications that are added with designs. Recording a test
5 Edit the test steps and save the test. Editing a test that uses application designs
6 Run the test with guided healing or auto healing enabled to update the test with the actual screens of the application after the web application is deployed and available to run. Running a Web UI test
7 View the report and verify the results of each step. Viewing a unified report
8 Apply the data collected during the test run to update the test.

Also, You can run the test, view the report, and update the test repeatedly to make it error free.

Updating tests by using the guided healing feature