HomeSelenium

Selenium IDE – Locating Strategy

Selenium IDE – Locating Strategy

<<Previous Post                            << Complete Tutorial>>                              Next Post>>

In one of the previous articles, I have explained – What are Locators?

Once you understand the above-mentioned article, you will understand that Locators are used for locating the UI element on the web pages.

And there are different types of locators we can use for locating the UI elements on the web pages.

In this article, I am going to explain and practically demonstrate the different types of locating strategies we can use in Selenium IDE for locating the UI elements on the web pages.

Let’s get started.

Selenium IDE – Locating Strategy

The following are the different locating strategies we can use in Selenium IDE for locating the UI elements on the web pages:

  1. ID
  2. Name
  3. Identifier
  4. XPath Expressions
  5. CSS Selectors
  6. DOM

The below diagram depicts the different locating strategies we can use in Selenium IDE:

Selenium IDE - Locating Strategies

Before I demonstrate all the above locating strategies, you should have an idea on all the below things:

  1. HTML Basics (You can start learning from here)
  2. Locators Concepts (You can start learning from here)
  3. XPath Expressions (You can start learning from here)
  4. CSS Selectors (You can start learning from here)

Assuming that you have an idea on all the above-mentioned list, I am going to practically demonstrate all the locating strategies that are possible with Selenium IDE below:

ID – Locating Strategy

Follow the below steps for understanding the usage of ID locating strategy in Selenium IDE for locating the UI elements on the web page:

1) Open http://omayo.blogspot.com/ in any browser and inspect ‘Button2’ button as shown below:

Selenium IDE - ID Inspect

2) Observe that the below HTML line of code having the id attribute got highlighted as shown below:

Selenium IDE - ID HTML highlight

3) From the above-highlighted HTML line of code, we can create the below ID locating strategy as:

id=but2

Enter the above-locating strategy into Selenium IDE > Target Field, click on the Search icon as and observe that the ‘Button2’ button which was inspected in step 1 will be located as shown below:

Selenium IDE - ID Locating Strategy

Here concludes the practical demonstration of ID locating strategy in Selenium IDE.

Now, I will practically demonstrate Name locating strategy in Selenium IDE.

Name – Locating Strategy

Follow the below steps for understanding the usage of Name locating strategy in Selenium IDE for locating the UI elements on the web page:

1) Open http://omayo.blogspot.com/ in any browser and inspect ‘Search’ field as shown below:

Selenium IDE - Name Inspect

2) Observe that the below HTML line of code having the Name attribute got highlighted as shown below:

Selenium IDE - Name HTML highlight

3) From the above-highlighted HTML line of code, we can create the below Name locating strategy as:

name=q

Enter the above-locating strategy into Selenium IDE > Target Field, click on the Search icon as and observe that the ‘Search This Blog’ text field which was inspected in step 1 will be located as shown below:

Selenium IDE - Name Locating Strategy

 

Here concludes the practical demonstration of Name locating strategy in Selenium IDE.

Now, I will practically demonstrate Identifier locating strategy in Selenium IDE.

Identifier – Locating Strategy

In the older version of Selenium IDE, Identifier locating strategy was used with both id and name attribute values for locating.

But in the latest Selenium IDE, Identifier locating strategy is no more supported.

For the below ID locating strategy example:

id=but2

We can also use the Identifier locating strategy as:

identifier=but2

And for the below Name locating strategy example:

name=q

We can also use the Identifier locating strategy as

identifier=q

As the identifier locating strategy is no more supported in Selenium IDE, the demonstration is not possible and we can ignore it from the list of locating strategies in the latest Selenium IDE.

XPath – Locating Strategy

Follow the below steps for understanding the usage of XPath locating strategy in Selenium IDE for locating the UI elements on the web page:

1) Let’s create an XPath Expression say //button[@id=’but2′] for locating the ‘Button2’ button on the web page.

Note: If you are not aware of creating XPath Expressions by yourself, start learning it from here: What is an XPath?

2) From the above-created XPath Expression, we can create the below XPath locating strategy as:

xpath=//button[@id=’but2′]

Enter the above-locating strategy into Selenium IDE > Target Field, click on the Search icon as and observe that the ‘Button2’ button will be located as shown below:

Selenium IDE - XPath Locating Strategy

Here concludes the practical demonstration of XPath locating strategy in Selenium IDE.

Now, I will practically demonstrate CSS locating strategy in Selenium IDE.

CSS – Locating Strategy

Follow the below steps for understanding the usage of CSS locating strategy in Selenium IDE for locating the UI elements on the web page:

1) Let’s create a CSS Selector say input[name=q] for locating the ‘Search this blog’ text box field on the web page.

Note: If you are not aware of creating CSS Selectors by yourself, start learning it from here: What is a CSS Selector?

2) From the above-created CSS Selector, we can create the below CSS locating strategy as:

css=input[name=q]

Enter the above-locating strategy into Selenium IDE > Target Field, click on the Search icon as and observe that the ‘Search this blog’ text box field will be located as shown below:

Selenium IDE - CSS Locating Strategy

Here concludes the practical demonstration of CSS locating strategy in Selenium IDE.

Now, I will practically demonstrate DOM locating strategy in Selenium IDE.

DOM – Locating Strategy

Follow the below steps for understanding the usage of DOM locating strategy in Selenium IDE for locating the UI elements on the web page:

1) Let’s create a DOM statement say document.getElementById(“but2”) for locating the ‘Button2’ button on the web page.

Note: I will explain the DOM (Document Object Model) concept in the upcoming articles. Till then blindly use the DOM statement I have given as part of the example.

2) We have to create the below DOM locating strategy using the above DOM expression:

dom=document.getElementById(“but2”)

But the latest version of Selenium IDE is no more supporting this DOM locating strategy and hence can’t be demonstrated here.

Here concludes the practical demonstration of all the different locating strategies in Selenium IDE.

In the next article, I will start practically demonstrating all the Selenium IDE commands.

Next Steps:

  • > To learn more about Selenium, continue to the next post (Click on Next Post link below)
  • > Check complete Selenium Tutorial Contents here (Click here)

Please leave your questions/comments/feedback below.

Happy Learning 🙂

About Me > Arun Motoori

On a mission to contribute to the Software Testing Community in all possible ways.

<<Previous Post                            << Complete Tutorial>>                              Next Post>>

If you like this article, share it on LinkedIn using the below button:

Comments (0)

Leave a Reply

Your email address will not be published. Required fields are marked *