Introduction to Locators
- Locators help Selenium in finding the UI elements on Web pages.
- We can use these locators in our test automation code to locate the UI elements on the Web pages.
Different types of Locators
The below are the different types of locators which can be used for locating the UI elements on the Web Pages:
HTML Basics for Locators
Having knowledge of below HTML basics will help you in understanding the locators better:
- Take any simple web page say http://compendiumdev.co.uk/selenium/basic_web_page.html and inspect it to find its html code
- Let’s decode the above to create our own web page similar to above
- Basic structure of HTML
- Inspecting few UI Elements on the web pages from omayo.blogspot.com and tutorialsninja.com/demo applications
Demonstrating Different types of Locators using Selenium
- id – Entering text into the text area field on omayo
- name – Enter text into the text box field on omayo
- class name – Click on the drop-down button on omayo
- link text– Click on the link say compendium dev on omayo
- xpath expression – Click on ‘Login’ button on omayo
- css selector– Click on ‘Login’ button on omayo
Though there are different types of locators available for locating the UI elements on the Web Pages, we need to use any one of them based on their priority.
The below is the priority order in which we need to select and use the locators :
SelectorsHub for Auto-generating the XPath Expressions and CSS Selectors
- We should not depend on Tools for generating XPath Expressions and CSS Selectors, instead we should learn by ourselves
- Manual Creation of XPath Expressions and CSS Selectors, will be explained later when required during the sessions.
- Installing SelectorsHub in any supported browser say chrome
- Inspect any element and go to SelectorsHub tab to auto-generate the XPath Expressions, CSS Selectors and other locators too.