• Selenium Video Tutorials

Selenium Webdriver - Select Support

Selenium Webdriver can be used to handle dropdown boxes on a web page using the Select class. There can be two types of dropdown on a web page - single select (allows selection one option) and multiple select (allows selection more than one option).

In HTML terminology, every dropdown is identified by the tagname called select. Also, each of its options are identified with the tagname called the option. In addition to it, a multiple select dropdown should have an attribute multiple.

Let us now discuss the identification of a dropdown on a webpage shown in the below image. First, we would need to right click on the webpage, and then click on the Inspect button in the Chrome browser. Then, the corresponding HTML code for the whole page would be visible. For investigating a single element on a page, we would need to click on the left upward arrow, available to the top of the visible HTML code as highlighted below.

Selenium Select Support 1

Once, we had clicked and pointed the arrow to the dropdown beside the text Select One, its HTML code was visible, both reflecting the select tagname(enclosed in <>), and its options within the option tagname.

Selenium Select Support 2 
<select class="form-select" id="inputGroupSelect03" aria-label="Example select with button addon">
   <option selected="">Pick one title</option>
   <option value="1">Dr.</option>
   <option value="2">Mr.</option>
   <option value="3">Mrs.</option>
   <option value="3">Ms.</option>
   <option value="3">Proof.</option>
   <option value="3">Other</option>
</select>

Please note one of the options Pick one title has the attribute selected, meaning this is selected by default, even before any option is selected.

Let us discuss some of the methods available in Selenium which would help us to access dropdowns on a web page.

  • getOptions() − returns the list of all options in the dropdown.

  • getFirstSelectedOption() − returns the selected option in the dropdown. If there are multi options selected, only the first item shall be returned.

  • isMultiple() − returns a boolean value, yields a true value if the dropdown allows selection of multiple items.

  • selectByIndex() − The index of the option to be selected by the dropdown is passed as a parameter. The index starts from 0.

  • selectByValue() − The value attribute of the option to be selected by the dropdown is passed as a parameter. The options in the dropdown should have the value attribute so that this method can be used.

  • selectByVisibleText() − The visible text of the option to be selected by the dropdown is passed as a parameter.

  • deselectByVisibleText() − The visible text of the option to be deselected by the dropdown is passed as a parameter. It is only applicable to multi-select dropdowns.

  • deselectByValue() − The value attribute of the option to be deselected by the dropdown is passed as a parameter. The options in the dropdown should have the value attribute so that this method can be used. It is only applicable to multi-select dropdowns.

  • deselectByIndex() − The index of the option to be deselected by the dropdown is passed as a parameter. The index starts from 0. It is only applicable to multi-select dropdowns.

  • deselectAll() − unselects all selected options from the dropdown.

  • getAllSelectedOptions() − returns all the selected options in the dropdown. If there are multi options selected, 0 or list of multiple selected options shall be returned. For a single select dropdown, the list of the 1 selected option shall be returned.

If a dropdown list has an attribute disabled for an option, that option would not be selected.

Let us take an example of the below page, where we would access the dropdown below the text Select One, select the value Others and perform some validations with the methods discussed above.

Selenium Select Support 3

Syntax

WebDriver driver = new ChromeDriver();

// identify dropdown then select its options by index
WebElement dropdown = driver.findElement(By.xpath("<value of xpath>"));

// Select class
Select select = new Select(dropdown);

// get option selected by default
WebElement o = select.getFirstSelectedOption();
System.out.println("Option selected by default: " + o.getText());

// select an option by index
select.selectByIndex(6);

// get selected option
List<WebElement> selectedOptions = select.getAllSelectedOptions();
for (WebElement opt : selectedOptions){
   System.out.println("Selected Option is: " + opt.getText());
}

// get all options of dropdown
List<WebElement> options =select.getOptions();
for (WebElement opt : options){
   System.out.println("Options are: " + opt.getText());
}

// check if multiselect dropdown
Boolean b = select.isMultiple();
System.out.println("Boolean value for checking is: "+ b);

Example

Code Implementation on SelectDropdowns.java class file.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.Select;
import java.util.List;
import java.util.concurrent.TimeUnit;

public class SelectDropdowns {
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);
      
      // Opening the webpage where we will get dropdown
      driver.get("https://www.tutorialspoint.com/selenium/practice/select-menu.php");

      // identify dropdown then select its options by index
      WebElement dropdown = driver.findElement(By.xpath("//*[@id='inputGroupSelect03']"));
      Select select = new Select(dropdown);

      // get option selected by default
      WebElement o = select.getFirstSelectedOption();
      System.out.println("Option selected by default: " + o.getText());

      // select an option by index
      select.selectByIndex(6);

      // get selected option
      List<WebElement> selectedOptions = select.getAllSelectedOptions();
      for (WebElement opt : selectedOptions){
         System.out.println("Selected Option is: " + opt.getText());
      }

      // get all options of dropdown
      List<WebElement> options =select.getOptions();
      for (WebElement opt : options){
         System.out.println("Options are: " + opt.getText());
      }

      // check if multiselect dropdown
      Boolean b = select.isMultiple();
      System.out.println("Boolean value for checking is: "+ b);
      
      // quitting browser
      driver.quit();
   }
}

Output

Option selected by default: Pick one title
Selected Option is: Other
Options are: Pick one title
Options are: Dr.
Options are: Mr.
Options are: Mrs.
Options are: Ms.
Options are: Proof.
Options are: Other
Boolean value for checking is: false

Process finished with exit code 0

In the above example, we had obtained the selected option in the dropdown with the message in the console - Selected Option is: Other. Then obtain all the options of the dropdown with the message in the console - Options are: Pick one title, Options are: Dr., Options are: Africa, Options are: Mr., Options are: Mrs., Options are: Ms, Options are: Proof., and Options are: Other. We had also validated that the dropdown did not have multiple selection options with the message in the console - Boolean value for checking is: false. We had also retrieved the option selected by default in the dropdown with the message in the console - Option selected by default: Pick one title.

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

Let us take another example of the below page, where we would access the multi-select dropdown beside the text Multi Select drop down, select the values Electronics & Computers and Sports & Outdoors, and perform some validations with the methods discussed above.

Selenium Select Support 4 
<select id="demo-multiple-select" multiple="">
   <option value="1">Books</option>
   <option value="2">Movies, Music & Games</option>
   <option value="3">Electronics & Computers</option>
   <option value="4">Home, Garden & Tools</option>
   <option value="5">Health & Beauty</option>
   <option value="6">Toys, Kids & Baby</option>
   <option value="7">Clothing & Jewelry</option>
   <option value="8">Sports & Outdoors</option>
</select>

Please note for a multiselect drop down, there should be an attribute as multiple, along with the select tagname.

Syntax

WebDriver driver = new ChromeDriver();

// identify multiple dropdown
WebElement dropdown = driver.findElement(By.xpath("<value of xpath>"));

// object of Select class
Select select = new Select(dropdown);

// gets options of dropdown in list
List<WebElement> options = select.getOptions();
for (WebElement opt : options){
   System.out.println("Options are: " + opt.getText());
}

// return true if multi-select dropdown
Boolean b = select.isMultiple();
System.out.println("Boolean value for multiple dropdown: "+ b);

// select item by value
select.selectByValue("3");

// select item by index
select.selectByIndex(7);

// get all selected options of dropdown in list
List<WebElement> selectedOptions = select.getAllSelectedOptions();
for (WebElement opt : selectedOptions){
   System.out.println("Selected Options are: " + opt.getText());
}

// get first selected option in dropdown
WebElement f = select.getFirstSelectedOption();
System.out.println("First selected option is: "+ f.getText());

// deselect option by index
select.deselectByIndex(7);

// deselect all selected items
select.deselectAll();

// get all selected options of dropdown after deselected
List<WebElement> delectedOptions = select.getAllSelectedOptions();
System.out.println("No. options selected: " + delectedOptions.size());

Example

Code Implementation on SelectMultipleDropdowns.java class file.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.Select;
import java.util.List;
import java.util.concurrent.TimeUnit;

public class SelectMultipleDropdowns {
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Opening the webpage where we will get dropdown
      driver.get("https://www.tutorialspoint.com/selenium/practice/select-menu.php");
      
      // identify multiple dropdown
      WebElement dropdown = driver.findElement(By.xpath("//*[@id='demo-multiple-select']"));

      // object of Select class
      Select select = new Select(dropdown);

      // gets options of dropdown in list
      List<WebElement> options = select.getOptions();
      for (WebElement opt : options){
         System.out.println("Options are: " + opt.getText());
      }

      // return true if multi-select dropdown
      Boolean b = select.isMultiple();
      System.out.println("Boolean value for multiple dropdown: "+ b);

      // select item by value
      select.selectByValue("3");

      // select item by index
      select.selectByIndex(7);

      // get all selected options of dropdown in list
      List<WebElement> selectedOptions = select.getAllSelectedOptions();
      for (WebElement opt : selectedOptions){
         System.out.println("Selected Options are: " + opt.getText());
      }

      // get first selected option in dropdown
      WebElement f = select.getFirstSelectedOption();
      System.out.println("First selected option is: "+ f.getText());
      
      // deselect option by index
      select.deselectByIndex(7);

      // deselect all selected items
      select.deselectAll();

      // get all selected options of dropdown after deselected
      List<WebElement> delectedOptions = select.getAllSelectedOptions();
      System.out.println("No. options selected: " + delectedOptions.size());

      // Closing browser
      driver.quit();
   }
}

Output

Options are: Books
Options are: Movies, Music & Games
Options are: Electronics & Computers
Options are: Home, Garden & Tools
Options are: Health & Beauty
Options are: Toys, Kids & Baby
Options are: Clothing & Jewelry
Options are: Sports & Outdoors
Boolean value for multiple dropdown: true
Selected Options are: Electronics & Computers
Selected Options are: Sports & Outdoors
First selected option is: Electronics & Computers
No. options selected: 0

Process finished with exit code 0

In the above example, we had obtained all the options of the dropdown with the message in the console - Options are: Books, Options are: Movies, Music & Games, Options are: Home, Garden & Tools, Options are: Health & Beauty, Options are: Toys, Kids & Baby, Options are: Clothing & Jewelry, Options are: Sports & Outdoors. We had also validated that the dropdown had multiple selection options with the message in the console - Boolean value for checking is: true. We had retrieved the selected options in the dropdown with the message in the console - Selected Options are: Electronics & Computers, Selected Options are: Sports & Outdoors. We had also obtained the first selected option with the message in the console - First selected option is: Electronics & Computers. Finally, we deselected all the selected options in the dropdown, and hence obtained the message in the console - No. options selected: 0.

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

In this tutorial, we discussed how to handle Select support using Selenium Webdriver.

Advertisements