WebDriver-Class Name Locator

WebDriver-Class Name Locator

In this tutorial, we will learn about the Class name locator of selenium WebDriver.

The Class Name locator is used to identify any element in UI based on the class backend attribute.

The Syntax of class name locator is as below:

driver.findElement(By.className(“value of class attribute”));

Let us see one sample test case in which we will try to identify the web element with the help of class name locators and automate the following scenarios:

Steps Actions Input Expected Result
1. Open the Google Chrome browser.   The Google Chrome browser should be opened.
2. Navigate to the Yahoo sign-up page. https://login.yahoo.com/account/create?done=https%3A%2F%2Flogin. yahoo.com%2Faccount%2Fpersonalinfo&specId=yidReg The Yahoo sign-up page must be displayed.
3. Identify the first-name text box and pass the value. Firstname=admin The first-name text box should be identified, and the value should be passed.
4. Identify the last-name text box and pass the value. Last Name=admin The last-name text box should be identified, and the value should be passed.
5. Close the Browser.   The Browser should be closed.
  • Firstly we have to Launch Eclipse and open the existing test suite new_test, which we have created in earlier sessions of the WebDriver tutorial.
  • Then right-click on the src folder and create a new Class File from New ? Class.
right-click on the src folder
  • And give your Class name as Class_name and click on the Finish button.
Class name as Class_name

Step1:

  • To access the Google Chrome Browser, first, we need to download the Google Chrome driver and set the system property for the Chrome driver.
  • We have already discussed this in previous sessions of the tutorial.
  • And you can also refer given link "Working with Chrome browser” for a better understanding that how we download it and set System property for Chrome driver.
// set the system property for chrome browser
System.setProperty("webdriver.chrome.driver", "C:\\Users\\JTP\\Downloads\\chromedriver_win32\\chromedriver.exe");
//create the object for chrome driver
WebDriver driver = new ChromeDriver();   

Step2:

After that, we will move to our second step, which navigates us to the given URL.

Here the sample code,

//navigate to the URL
 driver.get("https://login.yahoo.com/account/create?done=https%3A%2F%2Flogin.yahoo.com%2Faccount%2Fpersonalinfo&specId=yidReg"); 

Step3:

 Now we are trying to locate the first-name web element by using the value of its class name attribute.

  • Right-click on the first-name text box field and select Inspect element to identify the web element which is as shown below:
 identify the web element
  • And see that the Html code belongs to the first-name text box field got highlighted which is as shown in the below snapshot:
Html code belongs to the first-name text box
  • And notice that the above highlighted Html code has a class attribute.
  • We are using the class value as a class name locator value for identifying the first-name text box field on the particular web page.

Here the sample code for first-name text box:

//identify the first-name text box using class name locator and pass the value
driver.findElement(By.className("ureg-fname")).sendKeys("admin");
Thread.sleep(2000);
System.out.println("first name is entered"); 

Step4:

  • To locate our next web element, right-click on the last-name text box field and select Inspect option to identify the web element which is as shown below:
select Inspect option to identify
  • Notice that the Html code belongs to the last-name text box field got highlighted which is as shown in the below snapshot:
Notice that the Html code belongs to the last-name text box field got highlighted
  • And notice the above highlighted Html code has a class attribute
  • We are using the class value as a class name locator for identifying the last-name text box field on the particular web page.

Here the sample code:

//identify the last-name text box using class name locator and pass the value
 driver.findElement(By.className("ureg-lname")).sendKeys("admin");
 Thread.sleep(2000);
 System.out.println("last name value is entered"); 

Step5:

In the last step of our sample test case, we will close the existing browser,

The sample code for closing the browser,

//Close the browser
driver.close();

Our final test script will look like this:

package testpackage;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
public class Class_name {
public static void main(String[] args) throws InterruptedException { 
 //set the system property
System.setProperty("webdriver.chrome.driver","C:\\Users\\JTP\\Downloads\\chromedriver_win32\\chromedriver.exe");
 //creating the object for Chrome driver
 WebDriver driver = new ChromeDriver();
 driver.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);
 driver.manage().window().maximize(); 
 //Navigate to Yahoo sign-up page driver.get("https://login.yahoo.com/account/create?done=https%3A%2F%2Flogin.yahoo.com%2Faccount%2Fpersonalinfo&specId=yidReg");
 //identify the first-name text box using class name locator and pass the value
 driver.findElement(By.className("ureg-fname")).sendKeys("admin");
 Thread.sleep(2000);
 System.out.println("first name value is entered");
 //identify the last-name text box using class name locator and pass the value 
 driver.findElement(By.className("ureg-lname")).sendKeys("admin");
 Thread.sleep(2000);
 System.out.println("last name value is entered");
  //closing the browser 
 driver.close();
 }
 } 
  • To run the code in Eclipse, we have to right-click on the code and then select Run as ? Java Application.
  • The above test script will launch the Google Chrome browser and automate all the test scenarios. 
test script will launch the Google Chrome browser