Majority of the Web or Mobile applications developed today uses HTML or XML structure documents for UI. 

Document Object Model(DOM) is a programming API Interface that is used to alter the HTML or XML page structure. For the DOM to alter an element on the page, it requires a location mechanism that allows the DOM to search and locate the corresponding Element on the page.


We use different methods for this. The most prominent ones are XPath and CSS Selectors.


  • XPath - XPath is a query language used to navigate through elements and attributes in an XML document.
  • CSS Selectors - CSS selectors such as type, class, id, name e.t.c also allows us to select particular elements in the XML document.


UI Identifiers are phrases that use any of the methods to locate or select the page elements and we it to select and perform actions on Web page Elements during tests using Testsigm


Navigation

Testsigma supports both XPath and all the varieties of CSS Selectors. We can navigate to the UI Identifiers page by going through:


Applications > Select Application > Select Version > UI Identifiers


Locators supported by Testsigma


The following are the list Element identifiers or locators supported by Testsigma:

  • XPath
  • Css Selector
  • ID
  • Name
  • Link Text and Partial Link Text
  • Class Name
  • Tag Name





1. XPath:


XPath is a query language used to navigate through elements and attributes in an XML document. XPath locators are very powerful and flexible.

Any element on the page can be located using multiple XPath definitions and most other locators can be expressed as an XPath.


Example:

    XPath can find an element by ID like this:

    UI Identifier= //*[@id="email"]




2. CSS Selector:


CSS Selector is a string pattern used to identify an element based on a combination of HTML tag, id, class, and/or attributes.


Example:

    1. css Selector can find an element by Id like this:

         UI Identifier=input#email

    2. css Selector can find an element by class like this:

         UI Identifier=input.inputtext

                                               


3. Id:


ID is the most common way of locating elements since IDs are supposed to be unique for each element as per the W3C standard. If ID tags are available for an Element and they are unique, it is the most preferred option.


Example:

    ID of the element

    UI Identifier=”email”

                                                    


4. Name:


    Locating elements by Name is very similar to locating by ID, except that we use the "name="attribute instead. And moreover, name attributes are not strictly unique.


Example: 

    Name of the element

    UI Identifier=”userName”

                                                           


5. Link Text & Partial Link Text:


Finding an element with Link Text/Partial Link Text is very simple. But make sure that the link text is unique on the 

web page. If there are multiple links with the same link text (such as repeated header and footer menu links), in such 

cases action will be performed on the first matching element with link.


Example:

    link text of the element

    UI Identifier=”REGISTER”

 


6. Class name:


Class name locator selects the element which matches the values specified in the attribute name “class”.


Example: 

    class name of the element

    UI Identifier=”inputtext”

                                      


7. Tag name:


Tag Name locator is used to find the elements matching the specified Tag/Type Name. It is very helpful when we want to extract the content within a Tag.


Example: 

    tag name of the element

    UI Identifier=”input”