Find Element in Selenium : Differences between Selenium findElement and findElements

Finding elements on the webpage can be a nightmare due to the complexity of web elements. However, web elements play a vital role in developing and testing any application. To make things easier for testers, this article will offer some insight into Selenium findElement and findElements with the help of an example.

Here’s what the article will cover:

1. Introduction to Selenium findElement
2. Difference between findElement and findElements
3. Syntax of Selenium findElement
4. Types of locators
5. Using locator Strategy to findElement

Introduction to Selenium findElement

Interaction with a web page requires the driver to locate a web element and either trigger a JavaScript event like a click, enter, select, etc. or type in the field value. Usually, one starts automated testing of any web-app with finding relevant web elements on the web page. Most often, such automated testing is executed by using frameworks like Selenium WebDriver.

Selenium defines two methods for identifying web elements:

• findElement: A command used to uniquely identify a web element within the web page.
• findElements: A command used to identify a list of web elements within the web page.

Let’s understand the difference between these two methods in greater detail.

Difference between findElement and findElements

To understand some fundamental Selenium commands, take a look at Basic Commands of Selenium Webdriver.

Syntax of Selenium findElement

The findElement command returns an object of type WebElement. It can use various locator strategies such as ID, Name, ClassName, link text, XPath, etc.

Below is the syntax:

WebElement elementName = driver.findElement(By.LocatorStrategy("LocatorValue"));

Locator Strategy comprises the following values.

1. ID
2. Name
3. Class Name
4. Tag Name
5. Link Text
6. XPath

Locator Value is the unique method with which one can easily identify the web element.

Example:

driver.findElement(By.xpath("//input[@id='gh-ac']")).sendKeys("Guitar");

Syntax of Selenium findElements

The findElements command returns an empty list if there are no elements found using the given locator strategy and locator value. Below is the syntax of findElements command.

List<WebElement> elementName = driver.findElements(By.LocatorStrategy("LocatorValue"));

Example:

List<WebElement> listOfElements = driver.findElements(By.xpath("//div"));

Try Selenium Testing for Free

Now, let’s delve deeper into understanding how to find web elements with the help of various locators. One can refer different types of locators in Selenium.

Let’s understand how to use Selenium findElement in various ways:

1. Find by ID

ID is uniquely defined for each element and is the most common way to locate elements using ID Locator. If a website has dynamically generated ids, then this strategy cannot be used to uniquely find an element. However, it will return the first web element which matches the locator.

Example: Let’s take www.amazon.com for automating and find the elements. When one navigates through the search box and inspects the element, they will be able to see various web elements as shown in the snapshot below.

As you can see, it comprises an ID locator whose value is twotabsearchtextbox. The snippet below uses the same locator value to write a program.

from selenium import webdriver
driver = webdriver.Chrome(‘./chromedriver’)
#instance of Chrome | Firefox | IE driver
driver.get(<url>)

elementID = driver.findElement(By.id("twotabsearchtextbox"))
# will raise NoSuchElementException if not found

2. Find by Name

This is similar to Find By ID except the driver will locate an element by “name” attribute instead of “id”.

Example: Consider the same amazon webpage. The search box also has a name locator whose value is “field-keywords” as shown in the snapshot below.

The entire code remains similar to that of ID locator, except that the difference will be in the findElement syntax.

elementName = driver.findElement(By.name("field-keywords"))

3. Find By LinkText

LinkText is helpful to find links in a webpage. It is the most efficient way of finding web elements containing links.

Now, locate a Returns link as shown below.

When the tester hits that link and inspect, it locates the link text Returns as shown in the snapshot below.

This can be located simply by using Selenium findElement with the syntax below:

elementLinktext = driver.findElement(By.linkText(“Returns”))

4. Find By CSS Selector

CSS Selector is used to provide style rules for web pages and also can be used to identify one or more web elements.

Example: Consider the same search box of the Amazon page. It has a class attribute whose value is nav-search-input. Using the same value, the Selenium findElement method can locate the element.

elementcss= driver.findElement(By.cssSelector('div.nav-search-input'))

5. Find By XPath

XPath is a technique in Selenium to navigate through the HTML structure of a page. XPath enables testers to navigate through the XML structure of any document and can be used on both HTML and XML documents.

Example: Let’s try to locate the same search bar in Amazon with the help of XPath. The code below shows that it contains an ID locator. Note that relative XPath starts with ‘//’.

In the image below, one can see an input tag. Start with //input. Here //input implies a tag name. Make use of the id attribute and pass twotabsearchtextbox in single quotes as its value. This will give the XPath expression shown below:

//input[@id=’twotabsearchtextbox’]

Now, using Selenium findElement method, execute the code below:

elementxpath = driver.findElement(By.xpath("//input[@id=’twotabsearchtextbox’]"))

Run Selenium Tests for Free on Real Devices

Locating web elements is at the basis of automated Selenium testing of websites and web-apps. To know more about the fundamentals of Selenium, take a look at Selenium WebDriver Tutorial.