How to Handle Dropdown in Selenium?

code projected over woman
Reading Time: 2 minutes

In this blog,we will learn that how to handle dropdown through selenium webdriver.

As we know Dropdown is the set of HTML fields and in addition for handling dropdowns with selenium webdriver we use Select class.

Select in Selenium Webdriver

In addition Selenium provides the Select class to implement the HTML Select elements. Correspondingly The Select class in Selenium is an ordinary Java class that we use to create a new object using the keyword New and specifying a web element’s location.

Syntax

Select objSelect = new Select();

In the syntax above, it clearly states that Select is asking for an element type object for its constructor, i.e Also,it will create an object of the select class.

We need to Import the below package before using Select class:-

org.openqa.selenium.support.ui.Select

Types of Select Methods:

  1. selectByVisibleText Method
  2. selectByIndex Method
  3. selectByValue Method

SelectByVisibleText Method

It selects options that match the input text in the argument, also it will match the visible text in the dropdown field.

Syntax:

dropdown.selectByVisibleText();

selectByIndex Method

It Selects the option based on the index value.

Syntax:

dropdown.selectByIndex(Index);

selectByValue Method

It selects the option whose value attribute is likewise provided by the user in the specified parameter.

Syntax:

dropdown.selectByValue(Value);

CODE :

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.support.ui.Select;

public class dropdown {

public static void main(String[] args) throws InterruptedException {
System.setProperty(“webdriver.chrome.driver”, “drivers/chromedriver”);
WebDriver driver = new ChromeDriver();
// Launch Website
driver.navigate().to(“https://trytestingthis.netlify.app/”);

//Use Select class for selecting value from dropdown menu
Select dropdown = new Select(driver.findElement(By.id(“option”)));
dropdown.selectByIndex(1);
Thread.sleep(1000);
dropdown.selectByValue(“option 2”);
Thread.sleep(1000);
dropdown.selectByVisibleText(“Option 3”);
Thread.sleep(1000);

// Close the Browser
driver.close();
}
}

Browser -Chrome Browser

Url Link- https://trytestingthis.netlify.app/

After running, the above test script then it will launch the Chrome browser and select the value from the dropdown.

Some more Methods: De-select operations

deselectByIndex  :

Syntax: select.deselectByIndex(Index);
Purpose: Correspondingly ,this command deselects an option by index 

deselectByValue  

Syntax: select.deselectByValue(Value);
Purpose: Correspondingly,this command deselects an option by using “value” attribute”

deselectByVisibleText  

Syntax: select.deselectByVisibleText(Text); 
Purpose: Correspondingly ,this command deselects an option through its displayed text

deselectAll

Syntax: select.deselectAll();
Purpose: This command will deselects all the selected options which are selected previously.

Thanks, for reading!!

Please do check out our other blogs on a similar tech stack,

https://blog.knoldus.com/category/tech-blogs/test-automation/.

References:

https://www.selenium.dev/documentation/overview/

Written by 

Sakshi Sneha is Software Consultant in Knoldus Inc. She is always eager to learn new and advanced concepts in order to upskill herself.