Skip to main content

Elements

Elements are reusable UI locators you can reference across test cases. The recorder creates elements automatically when you record a test case. You can also create and edit elements manually.

How the recorder creates Elements​

When you record a test case, QAlity automatically creates elements for every UI interaction - clicks, inputs, and other actions. They appear in the Elements list under the screen name detected during recording.

note

Elements created by the recorder can be edited manually at any time - for example to update a selector after a UI change.

Elements list​

Click Elements under Advanced in the left sidebar.

Name - The element name.

Locator Type - The selector strategy used. Shown as a badge.

Screen Name - The screen or page this element belongs to.

Updated By - Who last edited the element.

Updated Date - When it was last changed.

Actions - Delete the element.

How to create an Element manually​

  1. Open Elements

    Go to Advanced - Elements in the sidebar.

  2. Create

    Click + Create Element in the top right.

  3. Fill in fields

    Fill in the fields (see Element fields below).

  4. Save

    Click Update to save.

Element fields​

Element Name (required)

A unique name to identify this element. Example: button-03

Screen Name (required)

The screen or page this element belongs to. Example: Login|QAlity

Selector Strategy (required)

How QAlity locates this element on the page.

ID - Locates element by its HTML id attribute.

Name - Locates element by its name attribute.

CSS Path - Locates element using a CSS selector.

XPath - Locates element using an XPath expression.

Link Text - Locates a link by its visible text.

Class Name - Locates element by its CSS class.

Tag Name - Locates element by its HTML tag.

Selector Value (required)

The actual locator expression. Example: //button[@aria-label='Toggle password visibility']

tip

XPath is the most commonly used selector strategy - it is also what the recorder uses by default.

How to edit an Element​

  1. Open the element

    Click the element Name in the list.

  2. Edit Element modal

    The Edit Element modal opens.

  3. Update fields

    Update the fields as needed.

  4. Save or cancel

    Click Update to save or Cancel to discard.

How to delete an Element​

Click the red trash icon in the Actions column and confirm deletion.

Best practices​

  • Use descriptive element names so they are easy to find and reuse across test cases
  • Group elements by screen name to keep the list organized
  • If a UI element changes, update its selector here once - all test cases using it update automatically
  • Delete elements that are no longer used to keep the list clean