Dropdown - Selenium Webdriver free Training

Welcome back to Selenium Webdriver free training. In the last tutorial, we talked about:

1. What is a checkbox and radio button?

2. how to select a radio button and multiple checkboxes.

Read How to handle Checkbox and Radio button?

Let’s move ahead and in this tutorial, we will discuss how to select the dropdown list with selenium webdriver.

What is Dropdown?

Dropdown is a web element that provides the ability to select one or multiple options.  To work with a dropdown list, selenium webdriver provides the inbuilt class org.openqa.selenium.support.ui.Select.  The Select Class is a method used to implement the HTML <SELECT> tag. The Select class has methods to select and deselect elements. The Select class is an ordinary class, so we can use new keyword to create its object.

Using the following method, you can create the Select class object:

Select select = new Select(WebElement webelement);

What is the best way to select a value from a drop-down?

The Select class of Selenium WebDriver provides the following methods to select an option/value from a drop-down:

  1. selectByIndex
  2. selectByValue
  3. selectByVisibleText

Read Switching Iframes – Selenium Webdriver Training

selectByIndex:

The method selects the option with its index number. As an argument, we give a value as the index number. There is a syntax that it has:

selectByIndex(int arg0) : void

The index of the value needs to be selected to be accepted. The index starts at 0. Suppose on the web page http://training.qaonlinetraining.com/testPage.php. We have to select the 4th value of the dropdown, as highlighted below:

As we can see, the above dropdown is being implemented using the <select> HTML tag, so we can use the “Select” class of Selenium WebDriver to select the option “France” using the index as shown below:

// Create object of the Select class
Select se = new Select(driver.findElement(By.xpath("/html/body/form/select[1]")));
            
// Select the option by index
se.selectByIndex(3);

selectByValue

The method selects the option with its value. So, we need to provide value as an argument. It has the following syntax:

selectByValue(String arg0) : void

If we consider the same dropdown on page http://training.qaonlinetraining.com/testPage.php:

Now, if we have to select the option “France”, we can use its value “FRANCE”, as shown in the following code snippet:

// Create object of the Select class
Select se = new Select(driver.findElement(By.xpath("/html/body/form/select[1]")));
            
// Select the option with value "FRANCE"
se.selectByValue("FRANCE");

As the value “FRANCE” corresponds to the option “France,” so it will select the value “France” from the dropdown.

Read How to Handle Alerts in Selenium Webdriver?

selectByVisibleText

This method allows you to select one option from the dropdown or multi-select dropdown based on the dropdown text. You need to pass the string value of the element as an argument. It has the following syntax:

selectByVisibleText(String arg0): void

If we consider the same dropdown on page  http://training.qaonlinetraining.com/testPage.php, we can see that each of the options of the country dropdown has a text value, which is displayed on the web page too, so we can use that text to select the related option, as shown below:

// Create object of the Select class
Select se = new Select(driver.findElement(By.xpath("/html/body/form/select[1]")));
            
// Select the option with value "FRANCE"
se.selectByVisibleText("France");

As the dropdown has one of the options having the text as “France”, the same will be selected using the above code.

Instructor-led Training

https://www.qaonlinetraining.com/programs/master-of-functional-automation-testing/

Conclusion

So, we have discussed how to select the option of the dropdown list with Selenium Webdriver. We also discussed the 3 different methods of Select class to select the same option. Alright!!!  In the next tutorial, we will discuss how to work with multi-select dropdown, and we will also work on code to select the dropdown value.