Finding an element using the findElement method_Selenium Testing Tools Cookbook（Second Edition）-QQ阅读女频现言网

上QQ阅读APP看书，第一时间看更新

Finding an element using the findElement method

Finding elements in Selenium WebDriver is done by using the findElement() and findElements() methods provided by the WebDriver and WebElement interface.

The findElement() method returns an instance of a WebElement that is found in the page DOM based on specified locators, also called search criteria. If it does not find an element using the specified search criteria, it will throw the NoSuchElementFound exception.

The findElements() method returns a list of WebElements matching the search criteria. If no elements are found, it returns an empty list.

Find methods take a locator or a query object as an instance of a By class as an argument. Selenium WebDriver provides a By class to support various locator strategies. The following table lists various locator strategies supported by Selenium WebDriver:

In this recipe, we will use the findElement() method to locate elements.

How to do it...

Finding elements using the id, name, or class attributes is the preferred way to find elements. Let's try using these methods to locate elements as described in the following sections.

Finding elements by the ID attribute

We can find elements using the value of the id attribute. While searching through the DOM, browsers use id as the preferred way to identify the elements, and this provides the fastest locator strategy.

Let's now look at how to use id attributes to find elements on a login form, as shown in the following code:

<form name="loginForm">
    <label for="username">UserName: </label> <input type="text" id="username" /><br/>
    <label for="password">Password: </label> <input type="password" id="password" /><br/>
    <input name="login" type="submit" value="Login" />
</form>

To locate the User Name and Password fields, we can use the id attribute in the following way:

WebElement username = driver.findElement(By.id("username"));
WebElement password = driver.findElement(By.id("password"));

Finding elements by the Name attribute

We might find situations where we cannot use the id attribute due to the following reasons:

Not all elements on a page have the id attribute specified
The id attributes are not specified for key elements on a page
The id attribute values are dynamically generated

In this example, the login form elements use the name attribute instead of the id attribute:

<form name="loginForm">
    <label for="username">UserName: </label> <input type="text" name="username" /><br/>
    <label for="password">Password: </label> <input type="password" name="password" /><br/>
    <input name="login" type="submit" value="Login" />
</form>

We can use the name attribute to find elements in the following way:

WebElement username = driver.findElement(By.name("username"));
WebElement password = driver.findElement(By.name("password"));

There could be multiple elements with similar name attributes. In such a case, the first element on the page with the specified value will be returned, which may not be the element we are looking for. This may cause the test to fail.

Tip

When building an application, you should recommend that the developers add the id attribute for key elements as well as other unique attributes to enable the easy search of elements. This also brings greater testability.

Finding elements by the Class attribute

Apart from using the id and name attributes, we can also use the class attribute to find elements. The class attribute is commonly used to apply CSS to an element.

In this example, the login form elements use the class attribute instead of the id attribute:

<form name="loginForm">
    <label for="username">UserName: </label> <input type="text" class="username" /></br>
    <label for="password">Password: </label> <input type="password" class="password" /></br>
    <input name="login" type="submit" value="Login" />
</form>

We can use the class attribute to find elements in the following way:

WebElement username = driver.findElement(By.className("username"));
WebElement password = driver.findElement(By.className("password"));

Sometimes multiple CSS classes are given for an element. For example:

<input type="text" class="username textfield" />

In this case, use one of the class name with the className() method.

How it works...

Selenium WebDriver provides the findElement() method to locate the elements that are required in a test script from the page under test.

When finding an element, this method will look through the DOM for matching elements with the specified locator strategy and will return the first matching element to the test.

There's more...

The WebElement interface also supports find methods that find child elements. For example, if there are some duplicate elements on a page but they are located in the separate <div> elements, we can first locate the parent <div> element and then locate the child element within the context of the <div> element in the following way:

WebElement div = driver.findElement(By.id("div1"));
WebElement topLink = div.findElement(By.linkText("top"));

You can also a use a shortcut method in the following way:

WebElement topLink = driver.findElement(By.id("div1")).findElement(By.linkText("top"));

NoSuchElementFoundException

The findElement()methods will throw the NoSuchElementFoundException exception when they fail to find the desired element using the specified locator strategy. The findElements() method returns an empty list when it does not find elements matching the locator.