QA Engineers, introduced with locators when they start their journey with Selenium (a most prominent UI Automation tool). Initially they learn about available locators and the order to use them for better automation testing. Like id, Name, Class, LinkText, PartialLinkText, CSS Selector and XPath.
Following are the different roles of locators used to locate the Basic UI HTML Elements on Webpage.
Scenario-1 Locate a button through ID, CSS-Seelctor & Xpath
Let HTML Code:
<button id="saverec"> Save Record </button>
Directly Locate by ID : By.id(“saverec”)
Locate by ID using CSS Selector : By.cssSelector(“button[id=’saverec’]”)
Locate by ID using XPath : By.xpath(“//button[@id=’saverec’]”)
Locate by Text using XPath : By.xpath (“//button[text()=’Save Record’]”)
Scenario-2 Locate an Anchor tag through LinkText, PartialLinkText & Xpath
Let HTML Code :
<a href = ‘http://url’> New User Register Here </a>
Directly Locate by Linktext : By.linkText(“New User Register Here”)
Directly Locate by Partial Linktext : By.partiaLinkText(“Register”)
Locate by Full Text using XPath : By.xpath(“//a[text()=’ New User Register Here’]”)
Locate by Partial Text using XPath : By.xpath(“//a[contains(text(),’Register’)]”)
Scenario-3 : Locate an Input Tag through Name, Class, CSS-Selector & Xpath
Let HTML Code :
<input type=”submit” name=”username” class=”textclass”/>
Directly Locate by Name : By.name (“username”)
Directly Locate by Class : By.class(“textclass”)
Locate by Class using CSSSelector : By.cssSelector (“input.textclass”)
Locate by Class using XPath : By.xpath(“//input[@class=’textclass’])
However, the above are the basic locators to work on simple HTML Elements.
Soon we will publish the next blog on some complex locators for nested HTML Elements.
I hope this would be helpful in your journey with Automation testing using Selenium.