Locating elements on a web page is done by using the findElement() and findElements() methods.
The findElement() method:
- Returns a WebElement based on a given search criteria
- Returns the first matching element
- Throws a NoSuchElementFound exception when the element cannot be found.
The findElements() method:
- Returns a list of WebElements based on a given search criteria
- Returns an empty list if no elements were found
The previously mentioned search criteria consist of a set of locator types:
- By ID: Finds elements by the value of their ID attribute. It is the most common way to identify elements on a page. However, not all elements have an ID, or they might be dynamically generated.
Here's the syntax:
driver.findElement(By.id(<element ID>))
Here's an example:
WebElement username = driver.findElement(By.id("username"));
- By Name: Finds elements by the value of their name attribute.
Here's the syntax:
driver.findElement(By.name(<element name>))
Here's an example:
WebElement password = driver.findElement(By.
name("password"));
- By Class name: Finds elements by the value of their class attribute.
Here's the syntax:
driver.findElement(By.className(<element class>))
Here's an example:
WebElement username = driver.findElement(By.
className("username"));
- By Tag Name: Finds elements by the value of their HTML tag. This method is not recommended if one is trying to locate a specific element on a page with multiple instances of such elements.
Here's the syntax:
driver.findElement(By.tagName(<htmlTagName>))
Here's an example:
// Locates a table by its ID
WebElement table = driver.findElement(By.id("table"));
// Counts the row of the table by locating the <tr>
elements of the table
List<WebElement> rows = table.findElements(By.
tagName("tr"));
int totalRows = rows.size();
- By Link Text: Finds a link by its displayed text. It returns all matching links that meet the specified text.
Here's the syntax:
driver.findElement(By.link-Text(<linktext>))
Here's an example:
//Locates the link corresponding to the HELP option
WebElement helpLink = driver.findElement(By.
linkText("HELP"));
// Takes the URL out of the link
string link = helpLink.getAttribute("href"));
- By Partial Link Text: Finds a link by a partial text. It is useful for links that are dynamically created. It returns all matching links that meet the specified text.
Here's the syntax:
driver.findElement(By.partialLinkText(<linkText>))
Here's an example:
// The "Messages" link includes the number of unread
messages and it is generated dynamically
WebElement msgLink = driver.findElement(By.
partialLinkText("Messages"));
// Takes the URL out of the link
String linkText = msgLink.getText();
- By XPath: Finds elements via XPath queries. With this method, it is possible to locate a parent element using a child element and vice versa.
Here's the syntax:
driver.findElement(By.xpath(<xpathexpresion>))
Here's an example:
// Locates an element with an absolute path
// If the structure of the HTML changes, the locator will
not find the element
WebElement email = driver.findElement(By.xpath("/html/body/
div/form/input"));
// Locates an element with a relative path assuming that
the email textbox is the first first <input> element of the
HTML page
WebElement email = driver.findElement(By.xpath("//input"));
// Locates an element using predicates assuming that the
email textbox is the third <input> element of the HTML page
WebElement email = driver.findElement(By.xpath("//
input[3]"));
// Locates an element using attributes values of an element
WebElement locatorsDiagram = driver.findElement(By.
xpath("//img[@alt='Selenium Locators Diagram']"));
// Locates an element by combining attributes values
WebElement button = driver.findElement(By.xpath("//input[@
type='submit'][@value='accept']"));
// Locates all elements that do not have an specific
attribute specified
List<WebElement> imagesWithAlt = driver.findElements(By.
xpath ("//img[not(@alt)]"));
- By CSS Selector: Finds elements by their CSS selector.
Here's the syntax:
driver.findElement(By.cssSelector(<selector>))
Here's an example:
/ Locates an element with an absolute path
// If the structure of the HTML changes, the locator will
not find the element
WebElement email = driver.findElement(By.cssSelector("html
body div form input"));
// Locates an element with a relative path assuming that
the email textbox is the first <input> element of the HTML
page
WebElement email = driver.findElement(By.
cssSelector("input"));
// Locates an element by its class attribute, specifying
the type of HTML tag (input) and the value of the class
attribute (accept)
WebElement acceptButton = driver.findElement(By.
cssSelector("input.accept"));
// Locates an element using the ID attribute by specifying
the type of HTML tag (input) and the value of the ID
attribute (email):
WebElement email = driver.findElement(By.
cssSelector("input#email"));
// Locates an element by the name attribute
WebElement userName = driver.findElement(By.
cssSelector("input[name=username]"));
We now have a better understanding of how to locate elements on a page using the findElement() and findElements() methods.