Web application controls

A control is a screen element in your application that you want to test. For example, a text box or a table. This topic lists all web application controls that Tosca Cloud supports:

Please note that web application controls have properties that you can also use in your tests. For a detailed list, check out Properties of web application controls.

Standard controls

Tosca Cloud supports the following standard controls for web applications

Web-specific controls

In addition to the standard controls listed in this topic, Tosca Cloud also supports the following controls:

Container

A container is an invisible area in your HTML file that contains controls. It's mainly used to manipulate or style a set of different controls as one.

Tosca Cloud identifies a control as a container if the tag DIV, SPAN, or FIELDSET exists in the HTML code.

EditBox

An EditBox is an empty or pre-filled field in which you can enter alphanumeric characters and symbols.

Tosca Cloud identifies a control as an EditBox if the tag INPUT exists in the HTML code.

HTML document

An HTML document encloses an external HTML file or snippet into an existing HTML frame. It's mostly used to integrate or embed third-party elements into your own HTML application, such as media, widgets, or even entire web pages.

Tosca Cloud identifies each entry of an HTML frame control as an HTML document.

HTML frame

Controls of this type contain HTML document controls as children.

Tosca Cloud identifies a control as an HTML frame if the tag FRAME or IFRAME exists in the HTML code.

If you use Chrome and want to store cookies for a local website, use the parameter --enable-file-cookies.

Number

Tosca Cloud identifies a control as a Number if the INPUT tag exists in the HTML code, and if the attribute Type has the value number.

PushButton

A PushButton is a clickable button in your HTML files. It usually triggers an action.

Tosca Cloud identifies a control as a PushButton if either of the following apply:

  • The tag BUTTON exists in the HTML code.

  • The tag INPUT exists in the HTML code, and the attribute TYPE has the value SUBMIT, RESET, BUTTON, or IMAGE.

Note that the technical action mode Push performs a DOM click followed by the specified FireEvents.

ShadowDOM

Tosca Cloud supports ShadowDOMs in open and closed mode in Google Chrome, Microsoft Edge Chromium, and Mozilla Firefox. You steer them like HTML Frames.

Window

A window displays an open window in a browser.

Tosca Cloud identifies a control as a window if the tag WINDOW exists in the HTML code.

Other steering options

This section explains additional options for automating web application controls.

Configuration parameter DisableGetElementById

This parameter helps to ensure that more than one control of the same ID is found. Tosca Cloud automatically generates the parameter during scanning if two or more controls share the same ID. Tosca Cloud adds it to each module attribute except the first one. The default value is True.

Steering parameter FireEvent

You can add the steering parameter FireEvent to all control types mentioned in this topic. To do so, specify the event handler in the Value field without the prefix on. For example, instead of onclick, specify the value click. Note that all designations are case-sensitive.

Action mode Input always triggers an event using the default operation of the business-based control.

To add several events, separate them with semicolons. For example, change;blur.

The availability of the events depends on the implemented controls. For detailed information on HTML events, see this W3Schools page (opens in new tab).

Steering parameter FireEventMethodIE

For applications that open with Internet Explorer and use the Microsoft specific method AttachEvent, you have to add the steering parameter FireEventMethodIE in addition to the parameter FireEvent.

You can specify the following values for the parameter FireEventMethodIE:

Value

Description

None

If you don't specify a value, the DispatchEvent is triggered. If no DispatchEvent is available, FireEvent is triggered.

FireEvent

Triggers FireEvents.

DispatchEvent

Triggers DispatchEvent .

FireEvent+DispatchEvent

Triggers FireEvent followed by DispatchEvent.

DispatchEvent+FireEvent

Triggers DispatchEvent followed by FireEvent.

Steering parameter SyncStateInteractive

By default, Tosca Cloud only steers websites whose loading status document.readyState is complete. You can specify that Tosca Cloud should also steer websites whose loading status is interactive. To do so, add the steering parameter SyncStateInteractive and set its value to false.

Alternatively, you can define SyncStateInteractive as a test case parameter.

Parameter SyncStateInteractive only works in tests your run in Internet Explorer.

Steering parameter AllowedAriaControls

Specify the ARIA elements you want Tosca Cloud to interact with during test runs.

Tosca Cloud automatically adds the steering parameter AllowedAriaControls to new modules and sets its value, based on the configuration of the IgnoreAriaControls setting.

You can define AllowedAriaControls as a steering parameter or as a test case parameter.

Steering parameter IgnoreAriaControls

Specify if you want Tosca Cloud to ignore all or specific ARIA elements during test runs.

We recommend that you use the AllowedAriaControls parameter to specify which ARIA elements Tosca Cloud ignores, to ensure the functionality of your modules as we extend ARIA support.

The parameter IgnoreAriaControls overrides the controls specified in the AllowedAriaControls parameter.

You can define IgnoreAriaControls as a steering parameter or as a test case parameter.

Steering parameter EnableSlotContentHandling

Add the steering parameter EnableSlotContentHandling to specify whether to display controls as children of their assigned slot element.

Note that in modules you upload from Tosca on-prem 2023.2 and older, the steering parameter isn't visible, which means it's set to True. If you want to change it and display controls as they are in the DOM structure, manually add the steering parameter EnableSlotContentHandling and set it to False.

Property IsSteerable

The technical property IsSteerable defines whether a control is steerable for Tosca Cloud, if not specified otherwise in the respective control.

From a technical point of view, Tosca Cloud verifies whether the property CurrentStyle.Display has a value other than none, and whether the property CurrentStyle.Visibility has a value other than hidden.

CSS style properties

You can identify HTML elements by using CSS style properties, which are properties that start with style_.

To load the style properties of a control, select the control during the scan. Select the More button and then Load all.

You can also steer CSS style properties with the action modes Verify, WaitOn, and Buffer.

Special formats for input controls

Some input elements require specially formatted data:

Value of type attribute

Data type

Expected format

Example

date

String

yyyy-MM-dd

2012-03-20

time

String

HH:mm or HH:mm:ss or HH:mm:ss.SSS

20:15 or 20:15:03

datetime-local

String

yyyy-MM-ddTHH:mm

2012-03-20T20:15

month

String

yyyy-MM

2012-03

week

String

yyyy-Www

2013-W04

color

String

#<hexadecimal color code>

#45AE3B

range

String

Any number.

Use a decimal separator that conforms to the localization of your machine.

3 or 3.14 or 31.4E-1

If you steer time-related controls (date, time, datetime-local, month, or week) with an empty value, Tosca Cloud clears the value of the HTML element.

Hidden input fields

You can't change the content of hidden input elements, which are that input elements that have the attribute type with the value hidden.

Left-clicks without mouse

You can perform left-clicks on all HTML controls with {CLICK}. Tosca Cloud then performs a left-click with the mouse.

Alternatively, you can perform left-clicks without the mouse. This is typically more stable, improves test performance, and allows Tosca Cloud to perform the click even if the machine is locked.

Choose one of the following options:

  • Perform left-click operations on buttons, radio buttons, and containers with x. This tells Tosca Cloud to verify whether the control is active and then to perform the left-click without the mouse.

  • Perform left-click operations on all HTML controls with {Invoke[Click]}. This tells Tosca Cloud to perform the left-click without the mouse right away.

Table headers from other tables

By default, tables have the steering parameters HeaderRow and HeaderColumn. However, you can override these steering parameters to customize a table with a header row or column from another table. To specify a header that belongs to another table, which we'll call the header table, follow these steps:

  1. Scan the header table and the table you want to add the header to, which we'll call the target table.

  2. Go to the target table and add a steering parameter named HeaderTable. As the parameter value, enter the header table's UniqueId.

  3. Delete these steering parameter from your target table: HeaderRow, HeaderColumn, RowCount, ColumnCount, ColumnNumber, RowNumber, RawColumnNumber, or RawRowNumber.

Also, keep these things in mind:

  • Use action mode Select for the header table.

  • Positioning. The header row or column goes into the index that it is assigned to in the header table. For example, if the HeaderRow of the header table is 2, the header appears as the 2nd row in the target table. Note that if the index exceeds the number of rows or columns in the target table, the header appears as the last row or column.

  • Possible changes in UniqueId. Uploading from Tosca on-prem changes the UniqueId of a test artifact. You have to adapt your HeaderTable steering parameter after every upload from Tosca on-prem.