Locating Elements

G C Reddy

3 years ago

Locating Elements in Selenium, Inspect web elements, locate web elements using unique locators, perform actions on elements using WebDriver methods.

Locating Web/HTML Elements

One of the most fundamental techniques to learn when using WebDriver is how to find elements on the page. WebDriver offers a number of built-in selector types.

An important task in Automated Functional Testing is ‘Locating Elements’ or Object Identification.

Note: No Front-end object reference is required for Database Testing. (Database Testing is a subset of Functional Testing).

Automated Functional Test Tools like Selenium, UFT/QTP, RFT, SilkTest, TestComplete, Watir, etc, are performed test operations based on front-end objects/elements (Ex: Link, Button, Edit Box, Image, etc,)

Performance Test Tools like LoadRunner, JMeter, RPT, SilkPerformer, NeoLoad, etc, are performed Test Operations based on protocols (Ex: HTTP, HTTPS, JDBC, ODBC, etc,).

Object/Element	Property/Locator	Value	Action	Parameter
Man	name	Venkat	Walk	Stick
Dog	color	black	jump	NA
Button	id	‘OK’	click	NA
Edit Box	name	‘username’	Enter a value	gcreddy7

Element Locators/Selectors in Selenium

What is an Element Locator?

It is an address that identifies a web element uniquely within a web page.

Selenium supports eight types of locators to locate/identify/recognize elements in web pages.

id()
name()
className()
tagName()
linkText()
partialLinkText()
cssselector()
xpath()

Why do we need to use different locators for locating elements?

• All locators may not visible for every element.
• Some locators are not applicable for every element
Ex: linktext() and partialLinkText()
• Some locators may be duplicated.
• tagName locator is not recommendable since it is duplicated for most of the elements.

Tips on using selectors/locators

• In general, if HTML IDs are available, unique, and consistently predictable, they are the preferred method for locating an element on a page. They tend to work very quickly.

• If unique IDs are unavailable, a well-written CSS selector is a preferred method of locating an element. XPath works as well as CSS selectors, but the syntax is complicated and frequently difficult to debug.

• Selection strategies based on linkText and partialLinkText have drawbacks in that they only work on link elements.

• Tag name can be a dangerous way to locate elements. There are frequently multiple elements of the same tag present on the page.

How to inspect Elements?

We inspect Web/HTML elements using a web browser, element locators are the same for all browsers, so we use any one of the browsers to inspect elements.

i. Mozilla Firefox
Built-in feature – Page Inspector

ii. Google Chrome
Built-in feature – Developer Tools (F12)

iii. Microsoft Edge
Built-in feature – Developer Tools (F12)

Element Locators for Locating Elements.

1. id()

Syntax:

Selenium Test Step
//Identifying an element and perform an action on the element.
driverObject.WebDriverMethod/findElement(By.ElementLocator/id(“Value”)).WebDriverMethod(arg);

Example:

System.setProperty(“webdriver.chrome.driver”, “D:\\chromedriver.exe”);
WebDriver driver = new ChromeDriver();
driver.manage().window().maximize();
driver.get(“http://gcreddy.com/project/admin/login.php”);

driver.findElement(By.id(“tdb1”)).click();

2. name()

Syntax:

driverObject.WebDriverMethod/findElement(By.name(“value”)).WebDriver();

Example:

System.setProperty(“webdriver.chrome.driver”, “D:\\chromedriver.exe”);
WebDriver driver = new ChromeDriver();
driver.manage().window().maximize();

driver.get(“http://gcreddy.com/project/admin/login.php”);
driver.findElement(By.name(“username”)).sendKeys(“India@123”);

3. className()

Syntax:

driverObject.WebDriverMethod/findElement(By.className(“value”)).WebDriverMethod(arg);

Example:

System.setProperty(“webdriver.chrome.driver”, “D:\\chromedriver.exe”);
WebDriver driver = new ChromeDriver();
driver.manage().window().maximize();

driver.get(“https://www.google.com”);
driver.findElement(By.className(“gb_f”)).click();

4. tagName()

Syntax:

driverObject.WebDriverMethod/findElement(By.tagName(“value”)).WebDriverMethod(arg);

Example:

System.setProperty(“webdriver.chrome.driver”, “D:\\chromedriver.exe”);
WebDriver driver = new ChromeDriver();
driver.manage().window().maximize();

driver.get(“https://www.gcreddy.com/2021/05/software-testing-tutorial.html”);
String pageHeading =driver.findElement(By.tagName(“h1”)).getText();
System.out.println(pageHeading);

5. linkText()

Syntax:

driverObject.WebDriverMethod/findElement(By.linkText(“value”)).WebDriverMethod(arg);

Example:

System.setProperty(“webdriver.edge.driver”, “C:\\Users\\Hello\\Desktop\\msedgedriver.exe”);
WebDriver driver = new EdgeDriver();
driver.manage().window().maximize();
driver.get(“https://in.yahoo.com/”);
Thread.sleep(3000);
driver.findElement(By.linkText(“Cricket”)).click();

6. parialLinkText()

Syntax:

driverObject.WebDriverMethod/findElement (By.ElementLocator/parialLinkText(“value”)).WebDriverMethod();

Example:

System.setProperty(“webdriver.chrome.driver”, “D://chromedriver.exe”);
WebDriver driver = new ChromeDriver();
driver.manage().window().maximize();

driver.get(“https://www.gcreddy.com/2020/03/software-testing-project.html”);
driver.findElement(By.partialLinkText(“Admin”)).click();

7. cssSelector()

Syntax:

driverObject.WebDriverMethod/findElement (By.ElementLocator/cssSelector(“value”)).WebDriverMethod();

Example:

System.setProperty(“webdriver.chrome.driver”, “D://chromedriver.exe”);
WebDriver driver = new ChromeDriver();
driver.manage().window().maximize();

driver.get(“http://gcreddy.com/project/admin/login.php”);
driver.findElement(By.cssSelector(“#contentText > table > tbody > tr:nth-child(2) > td > form > table > tbody > tr:nth-child(1) > td > input[type=text]”)).sendKeys(“India1234”);