Locators

Locators are used to locate elements on a given UI application. In addition to supporting all the selenium locators, BQ comes with several other user-friendly locators. In BQ one does not have to worry about locators since BQ Genie automatically captures or creates them for you. However, having an understanding of locators will help you better debug your tests and make your tests more stable.

Here is a list supported locators :

  • Id
  • Name
  • Link text
  • Partial Linktext
  • Tag Name
  • Class Name
  • Dom
  • Css
  • Xpath
  • Label 
  • ClosestLabel
  • Placeholder
  • Text

Locating By Id #

This is the most common and efficient way to locate an element as the ID is suppose to be unique for each element.

Format: id=id of the element


Locating By Name #

Locating elements by name is very similar to locating elements by ID.

Format: name=name of the element


Locating By Link Text #

Elements can also be located by link text.

Format: linktext=link_text


Locating By Partial Link Text #

Locating element via Partial Link Text works similar to Link Text locator. 

Sometimes we might end up with long link text and in that scenario it’s better to use Partial Link Text locator over Link Text Locator to perform further actions on the element.

Format: partiallinktext=partial_link_text


Locating By Tag Name #

This is the most common way to locate an element as an ID is suppose to be unique for each element.

Format: tagname=tagname

Please make sure that the tag is unique so that the element can be found precisely.


Locating By Class Name #

Locating elements by class name is similar to locating elements by name. We simply look for the tag named class.

Format: classname=class_name

classname=form-control

This should locate the element.


Locating By Dom #

In document object model (DOM) we locate element in terms of DOM model. We can locate an element via ID and name through the below mentioned methods of the DOM

  • getElementById
  • getElementByName

getElementById #

Format: document.getElementById(“id”)

For example : 

dom=document.getElementById(“username”)

This should locate the element.


getElementByName #

Format: document.getElementByName(“name”)[index]

For example : 

dom=document.getElementByName(“j_username”)[0]

This should locate the element.


Locating By CSS #

CSS selectors are string patterns used to identify an element based on a combination of HTML tag, id, class, and attributes. Locating elements by css allows user to locate elements faster than the other methods.

“#” stands for id and “.” stands for class
If you wish to navigate to a descendant of an element use a single space.

CSS selectors can be located through various formats :

Formats: 

Tag and ID #

Format : css=tag#id_value

For example :

css=ul#projlist

This should locate the element.

Tag and Class #

Format : css=tag.class_value

For example :

css=li.dropdown

This should locate the element.

Tag and Attribute #

Format : css=tag[attribute=value]

For example :

css=a[title=’Project: Test Project’]

This should locate the element.

Tag, Class and Attribute #

Format : css=tag.class[attribute=value]

For example : 

css=a.dropdown-toggle[title=’Project: Test Project’]

This should locate the element.

Matches (Starts with, Ends with, Contains) #

Format : css=tag[attribute^=start of the string]

For example : 

css=a[title^=’Project:’]

This should locate the element.

Format : css=tag[attribute$=end of the string]

For example : 

css=a[title$=’Project’]

This should locate the element.

Format : css=tag:contains(“inner_text”)

For example :

tag:contains(“inner_text”)

This should locate the element.

Child elements #

Format : css= tag#id_name tag:nth-child(index of the referenced child)

For example : 

css=ul#projlist li:nth-child(3)

This will locate the third child of the current node.

Format : css= tag#id_name tag:last-child

For example :

css=ul#projlist li:last-child

This will locate the last child of the current node.


Locating By Xpath #

Xpath helps in locating elements on the web page using XML expressions.

Basic Format : xpath=//tag[@attribute=’attribute_value’]

There are multiple ways through which xpath can be defined. Few formats are mentioned below.

Contains #

By using ‘contains’ function in xpath, we can extract all the elements which matches a particular text value.

Syntax : xpath=//tag[contains(text(),’text’)]

For example :

xpath=//a[contains(text(),’Project’)]

This xpath will locate all the elements that contain text Project

Ancestor #

To find an element on the basis of the parent element we can use ancestor attribute of xpath.

Syntax : xpath=//tag[@attribute=’attribute_value’]/ancestor::tag

For example :

xpath=//a[contains(text(),’Test Project’)]/ancestor::div[@class=’container-fluid’]

This xpath will locate the element tag with class container-fluid.

Parent #

By using Parent, you can find the parent node of the current node in the web page.

Syntax : xpath=//tag[@attribute=’attribute_value’]/parent::tag

For example :

xpath= //a[contains(text(),’Test Project’)]/parent::li

This xpath will locate the parent of the current node.

Following Sibling #

By using following sibling function, you can find the following sibling of the current node in the web page.

Syntax : xpath=//tag[@attribute=’attribute_value’]/following-sibling::tag

For example :

xpath=//a[@id=’updateProject’]/following-sibling::ul

This xpath will locate the following sibling of the current node.

Preceding Sibling #

By using preceding sibling function, you can find the preceding sibling of the current node in the web page.

Syntax : xpath=//tag[@attribute=’attribute_value’]/preceding-sibling::tag

For example :

xpath=//ul[@id=’projlist’]/preceding-sibling::a

This xpath will locate the preceding sibling of the current node.

Or #

By using the OR function, you can use two conditions in an XPath. It only finds the element if any one of the two conditions is true.

Syntax : xpath=//tag[@attribute=’attribute_value’ or @attribute=’attribute_value’]

For example :

xpath=//a[@id=’updateProject’ or @title=’Project: Test Project’]

This xpath will locate the element only if either of the two conditions are true.

And #

By using the AND function, you can use two conditions in an XPath. It only finds the element if both the conditions are true.

Syntax : xpath=//tag[@attribute=’attribute_value’ and @attribute=’attribute_value’]

For example :

xpath=//a[@id=’updateProject’ and @title=’Project: Test Project’]

This xpath will locate the element only if both the conditions are true.

Starts-with #

Using starts-with function, you can find the element whose attribute value changes dynamically on refresh or other operations like click, submit, etc.

Syntax : xpath=//tag[starts-with(@attribute,’attribute_value’)]

For example :

xpath=//a[starts-with(@title,’Project:’)]

This xpath will locate the element that starts with the mentioned attribute value.

Ends-with #

Using ends-with function, you can find the element whose attribute value changes dynamically on refresh or other operations like click, submit, etc.

Syntax : xpath=//tag[ends-with(@attribute,’attribute_value’)]

For example :

xpath=xpath=//a[ends-with(@title,’Project’)]

Preceding #

By using the preceding function, you can find all the preceding elements of the mentioned tag.

Syntax : xpath=//*[@attribute=’attribute_value’]//preceding::tag

For example :

xpath=//ul[@id=’projlist’]//preceding::a

Descendant #

By using the preceding function, you can find all the descendant elements of the mentioned tag.

Syntax : xpath=//*[@attribute=’attribute_value’]//descendant::tag

For example :

xpath=//ul[@id=’bqtopnav’]//descendant::li


Locating By Label #

Locating elements by label can be done in the below mentioned way for elements of type input, textarea and select.

Formats available: 

  • label=text
  • label=previous_sibling’s_text
  • label=parent’s_text

Format : label=inner_text

In this case, we first check the id attribute of the input tag with the for attribute of the label tag. If both of attribute values are equal, we make a note of the inner text of the label tag.

For example :

label=Male

This should locate the element.

Format : label=first_previous_sibling’s_inner_text

We use this format when:

  1. value of id attribute is not equal to the value of for attribute.
  2. when one of the attribute is not found under a tag.

We make a note of the inner text of the first previous sibling

Please Note : The first previous sibling should be label tag.

For example :

label=Male

This should locate the element.

Format : label=parent’s_text

This format is used when value of id is not equal to value of for AND the first previous sibling is not label.


Locating By ClosestLabel #

Locating elements by closest label

Format: 


Locating By Placeholder #

Locating elements by placeholder is quite similar to locating an element by id or name.

Format: placeholder=placeholder_value

For example :


Locating By Text #

Locating elements by text is an easy way of locating an element using exact text match.

Format: text=inner_text

For example :