Quality Modeller's UI Scanner

Overview Video

The Object Scanner creates page object models at the click of a button. The page objects can then be called from models in Quality Modeller, quickly and simply automating the Test Cases associated with that Model. Magento website link.

How to Scan a Webpage

To scan a webpage, simply click the "scan" button in the UI Scanner Explorer menu:

Enter a name for the page object model, and select the model folder into which it will saved in the Quality Modeller Workspace:

Click "Upload" and you will be notified when the page object model has saved:

The page object model will now appear in the relevant folder in the "models" section of the Quality Modeller workspace:

Refresh the page if you cannot see it.

How to Inspect and Edit Page Objects in Quality Modeller

To open a captured page object Model in Quality Modeller, select the relevant context and navigate to the "Models" tab. Click on a Page Object Model to inspect it.

A page object model contains every scanned page object, categorized row-by-row by type and element name. Expanding a given row will display the captured information associated with that element:

The captured information includes:

1. The parameter: the identifier that will be used by automated tests to interact with the page object.
2. The identifier type, for instance ID, class name, type, and path type.
3. The confidence rating: the likelihood that the element will exercise that page element during automated testing.

Click a row's blue edit button to edit, add, or remove identifiers associated with a given element:

To delete an identifier from a given element, click the red cross button for that row. The identifier will no longer be used by automated tests to exercise that element. Clicking "New Identifier" will add a new row:

Select an identifier type, specify the ID, and click "OK". The identifier will now be used by automated tests to exercise the edited element.

Click "new object" in the Page Object viewer to manually add a new page object. Provide an object name, add identifiers by row, and then select the identifier type and specify the ID.

Any changes made to existing page objects that are linked to models will be reflected automatically in the automated test pack. This provides a quick and centralised approach to editing and maintaining existing automated tests. Elements are updated across every automated test in which they feature in, saving time when compared with repetitiously updating every test individually.

How to Overlay Page Objects onto Models

Page elements scraped from web UIs by the Quality Modeller Explorer's Object Scanner can be leveraged in the Quality Modeller model editor, to quickly generate optimised automated tests.

How to Create a Model Using The UI Scanner

In addition to generating Page Objects and test automation modules, Quality Modeller generates flowcharts from web UI scans.

In the Quality Modeller Explorer, create a new folder for your scanned model:

In Chrome, go to the website you want to scan. Click on the Modeller Chrome extension, select the project you want the scan to be created under, and click on Scan.

On the website, click on the elements that you want to scan. Next, click on the Modeller extension and click on Stop.

Then click Upload:

The Upload Page Object dialogue appears. Select the folder you want the scanned variables, modules and model to be created in. Then click on the Advanced dropdown, select Create Model, and click on Save:

You will see the following notification when the upload is complete:

Modeller automatically creates the variables, modules and the model. These can be seen in Quality Modeller explorer in the folder you created, with valid and invalid paths, ready for generation and creation of test data and cases.

If you click on the model file, you will see a flowchart model: