Validate HTML attribute (Web)

The HTML attribute validation allows you to validate the value of any HTML attribute of an element (e.g. href, src, alt, title, etc.). It is also possible to validate a "disabled" attribute, as explained below.

Adding a Validate HTML attribute step

→ To add a Validate HTML attribute step:

  1. Hover over the :fa-caret-right: (arrow symbol) where you want to add the validation.

    2. The action options are displayed.

  2. Click on the Toggle breakpoint button.

  3. Click on the Run test button, to run the test until the breakpoint.

  4. Hover over the :fa-caret-right: (arrow symbol) again and click on the “M” (Testim predefined steps).

    5. The Predefined steps menu opens.

  5. Click on Validations.

    6. The Validations menu expands.

  6. Scroll down through the menu and select Validate HTML attribute.

    7. Alternatively, you can use the search box at the top of the menu to search for Validate HTML attribute.

  7. In the AUT window, identify the relevant element for which you wish to validate an HTML attribute, and click on it to select it.

    8. The HTML Attribute Validation form is shown.

  8. In the Attribute name field, enter a valid HTML attribute that you wish to validate (e.g. href, src, alt, title, etc.).

  9. In the Expected value field, enter the value you wish to validate for the attribute (e.g. https://www.testim.io).

    10. For the expected value you can use regex. For example, 'href' that starts with https will have the following regex:/^https/

  10. Click OK.

    11. The “Validate HTML attribute” step is added in the Editor, and a thumbnail of the selected element is shown in the step.

  11. Click on the Toggle Breakpoint button after the validation step to remove the breakpoint.

Validating a "disabled" attribute

It is also possible to validate a "disabled" HTML attribute. → To validate a disabled attribute:

  1. Perform steps 1-6 above.

  2. In the AUT window, identify the relevant element for which you wish to validate the "disabled" HTML attribute, and click on it to select it.

    3. The HTML Attribute Validation form is shown.

  3. In the Attribute name field, enter the value 'disabled'.

  4. In the Expected value field, do not enter any value.

  5. Click OK.

    6. The “Validate HTML attribute” step is added in the Editor, and a thumbnail of the selected element is shown in the step.

  6. Click on the Toggle Breakpoint button after the validation step to remove the breakpoint.

Modifying a Validate HTML attribute step

If you want to change the element you selected, you don’t need to delete and re-record the step. Instead, you can reassign the element with a different element. Alternatively, you can modify the attribute name and/or expected value of the original element you selected without selecting a new element. → To reassign the selected element in a Validation step:

  1. Hover over the position to the left of the step for which you want to reassign the element and click on the Toggle breakpoint button.

  2. Click on the Run test button to run the test until the breakpoint.

  3. Hover over the step for which you want to reassign the element and click on the Show Properties (:fa-cog:) icon.

    4. The Properties panel opens on the right-hand side.

  4. Hover over the Target element thumbnail to show options, and click Reassign.

  5. In the AUT window, identify the new element that you would like to select and click on it.

    6. The selected element is shown in the Target element box in the Properties panel.

  6. In the Properties panel Attribute name field enter the attribute name for the new element.

  7. In the Properties panel Expected value field enter the expected value of the new attribute.

    8. When modifying the value of the Attribute name and Expected value in the Properties panel, make sure they are enclosed in single quotes: e.g. ‘href’ and ‘https://www.testim.io’.

  8. Click on the same Toggle Breakpoint button to the left of the step for which you reassigned the element to remove the breakpoint.

→ To modify the properties of theoriginal element:

  1. Hover over the step for which you want to reassign the element and click on the Show Properties (:fa-cog:) icon.

    2. The Properties panel opens on the right-hand side.

  2. In the Properties panel Attribute name field enter the new attribute name for the element.

  3. In the Properties panel Expected value field enter the new expected value of the attribute.

When modifying the value of the Attribute name and Expected value in the Properties panel, make sure they are enclosed in single quotes: e.g. ‘href’ and ‘https://www.testim.io’.