A web page is made up of many locators (eg. id, class, name etc.). Using these locators selenium can interact with any web page. In all, Selenium web driver uses 8 locators to find the desired elements on any web page. They are:
- ID
- Name
- Link Text
- Partial Link Text
- Tag Name
- Class Name
- CSS Selector
- XPath
ID: Id’s are the easiest way to find any element on a web page. They should only be used when the id corresponding to a web element is unique. But there are scenarios in which Id’s are generated dynamically or they are are not unique, in those cases, we will have to consider some other locator.
1 2 3 4 5 | //HTML Code <input id="name" name="bookname" type="text" placeholder="Book Name*" /> //Selenium Code WebElement idEle= driver.findElement(By.id("name")); |
Name: If any web element doesn’t have an id or there is a condition that the id’s are getting generated dynamically; the next choice should be to go for the name locator. But here again, there are chances that the names of two fields are same. So it should only be considered when the name is unique.
1 2 3 4 5 | //HTML Code <input id="name" name="bookname" type="text" placeholder="Book Name*" /> //Selenium Code WebElement nameEle= driver.findElement(By.name("bookname")); |
Link Text: It is used to find any links on a web page. Here also, the link text should be unique on the web page; otherwise, if the web page has multiple instances of the same link text, the selenium will consider the first link.
1 2 3 4 5 | //HTML Code <a href="http://www.testersdock.com">Testing Blog</a> //Selenium Code WebElement linkTextEle= driver.findElement(By.linkText("Testing Blog")); |
Partial Link Text: Like link text, Partial link text also works the same way, but here instead of giving the full link text name, we only give the partial link text name.
1 2 3 4 5 | //HTML Code <a href="http://www.testersdock.com">Testing Blog</a> //Selenium Code WebElement partialEle= driver.findElement(By.PartialLinkText("Testing")); |
Tag Name: It is used when the web element doesn’t have either a class or ID. Mostly used for Select drop downs and check boxes.
1 2 3 4 5 6 7 8 9 10 11 | //HTML Code<select> <option value="english">English</option> <option value="hindi">Hindi</option> <option value="german">German</option> <option value="french">French</option> <option value="other">Other Language</option> </select> //Selenium Code Select tagNameSelect = new Select(driver.findElement(By.tagName("select"))); select.selectByVisibleText("English"); |
Class Name: Similarly like Id’s, we can use class names to locate HTML elements. CSS classes are used to style any web element. Class names are usually used for many web elements on the web page to incorporate consistent design throughout the web page elements. So here also, while chosing a class name we must be sure that it is unique.
1 2 3 4 5 | //HTML Code <input class="name" type="text" placeholder="Book Name*" /> //Selenium Code WebElement className =driver.findElement(By.className("name")); |
CSS Selectors: It is another alternative to locate any web element when it doesn’t fit the criteria for Id, Class or Name. CSS Selector is a way to identify element on the basis of their CSS property and selectors (like id, class, name etc.). Click here to explore CSS Selectors in detail.
1 2 | //Selenium Code WebElement cssSelector = driver.findElement(By.cssSelector("input[id='name']")); |
XPath: Short for XML Path. Since an HTML document is also an XML document, we can use XPath to locate any web element. There are two types of XPath: Absolute & Relative. Click here to explore XPath in detail.
1 2 3 4 5 6 7 8 | //HTML Code <input id="bookname" class="name" type="text" placeholder="Book Name*" /> //Relative XPath driver.findElement(By.xpath("//input[@id='bookname']")); //Absolute XPath driver.findElement(By.xpath("/html/body/div[1]/div[2]/label[1]/input")); |