HomeSelenium

Locators for Selenium – Demonstrating DOM Locators

Locators for Selenium – Demonstrating DOM Locators

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

In the previous articles, I have explained what are locators? and Different types of locators.

In this article, I am going to practically demonstrate the usage of DOM locators for locating the UI elements on the Web Pages.

Note: This article is just for demonstrating DOM at a high level. DOM will be explained in detail in the upcoming articles.

Let’s get started.

Locators for Selenium – Demonstrating DOM Locators

Follow the below steps for locating the UI elements on the Web Pages using DOM Locator:

1) Navigate to http://omayo.blogspot.com/ in your chrome browser as shown below:

Locators for Selenium - Navigate to Omayo in Chrome

2) Scroll down in the above page, right click on ‘Button2’ button and select ‘Inspect’ option as shown below:

Locators for Selenium - Inspect

 

3) Observe that the HTML code related to the ‘Button2’ Button got highlighted as shown below:

Locators for Selenium - HTML Highlightedv

4) Double click on the id attribute value (i.e. but2) of the highlighted HTML line, right-click and select ‘Copy’ option as shown below:

Locators for Selenium - Copy ID Locator Value

5) Now click on the ‘Console’ tab as shown below:

DOM Locator - Console Tab

6) Now type the below DOM statement as shown below:

DOM Locator - Dom Statement

7) Now paste the copied id attribute value into the DOM statement and press Enter key on your keyboard to execute as shown below:

DOM Locator - DOM Executed

8) Hover the mouse of the HTML line which got displayed as result in the Console tab and observe that the ‘Button2’ button is getting highlighted as shown below:

DOM Locator - Button Highlighted

The above step proves that the DOM Locator ( dom=getElementById(“but2”) ) is able to locate the ‘Button2’ button on the web page.

In the next article, I will demonstrate the Priority of Locators.

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 *