π― How to Select a Value from a DropDown in Selenium WebDriver?
π What is a DropDown in Selenium?
A DropDown is a UI element that allows users to select a value from multiple options. In HTML, dropdowns are created using the <select>
tag, with multiple <option>
elements inside.
β Example of a DropDown in HTML
<select id="country">
<option value="us">United States</option>
<option value="uk">United Kingdom</option>
<option value="in">India</option>
</select>
π Handling DropDowns Using Selenium WebDriver
In Selenium, we use the Select class to interact with dropdowns.
πΉ 1οΈβ£ Selecting a Value by Visible Text
The easiest way to select a dropdown value is by using the visible text of the option.
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;
public class SelectDropdownExample {
public static void main(String[] args) {
WebDriver driver = new ChromeDriver();
driver.get("https://example.com");
// Locate the dropdown element
WebElement dropdown = driver.findElement(By.id("country"));
// Create Select object and select by visible text
Select select = new Select(dropdown);
select.selectByVisibleText("India");
driver.quit();
}
}
πΉ Example: This selects "India"
from the dropdown.
πΉ 2οΈβ£ Selecting a Value by Index
Each option in a dropdown has an index starting from 0. We can select an option using the index.
// Select the 2nd option (index starts from 0)
select.selectByIndex(1);
πΉ Example: If the dropdown contains United States, United Kingdom, India, selecting index 1 chooses "United Kingdom"
.
πΉ 3οΈβ£ Selecting a Value by Value Attribute
Each <option>
tag may have a value
attribute. We can select an option using its value.
// Select using value attribute
select.selectByValue("in");
πΉ Example: If <option value="in">India</option>
, it selects "India"
.
π Handling Multi-Select DropDowns
Some dropdowns allow multiple selections by setting multiple="multiple"
in the HTML.
β Example HTML for Multi-Select
<select id="fruits" multiple="multiple">
<option value="apple">Apple</option>
<option value="banana">Banana</option>
<option value="cherry">Cherry</option>
</select>
β Handling Multi-Select with Selenium
// Locate multi-select dropdown
Select multiSelect = new Select(driver.findElement(By.id("fruits")));
// Select multiple options
multiSelect.selectByVisibleText("Apple");
multiSelect.selectByVisibleText("Banana");
// Deselect an option
multiSelect.deselectByVisibleText("Apple");
// Deselect all
multiSelect.deselectAll();
βοΈ Note: Single-select dropdowns do not support deselect()
methods.
π΅οΈββοΈ Checking if DropDown is Multi-Select
if (select.isMultiple()) {
System.out.println("This is a multi-select dropdown.");
} else {
System.out.println("This is a single-select dropdown.");
}
π Getting All Available Options
To retrieve all options inside a dropdown:
List<WebElement> options = select.getOptions();
for (WebElement option : options) {
System.out.println(option.getText());
}
π Handling Dynamic DropDowns (Without <select>
Tag)
Some dropdowns are custom-built (e.g., JavaScript-based) and do not use <select>
. In such cases, we use click actions.
β Example HTML for Dynamic DropDown
<div class="dropdown">
<button class="dropdown-toggle">Select Country</button>
<div class="dropdown-menu">
<a class="dropdown-item">United States</a>
<a class="dropdown-item">United Kingdom</a>
<a class="dropdown-item">India</a>
</div>
</div>
β Handling a Dynamic DropDown in Selenium
// Click dropdown to open options
driver.findElement(By.className("dropdown-toggle")).click();
// Select "India" by clicking on it
driver.findElement(By.xpath("//a[text()='India']")).click();
π― Conclusion
β Use Select
class for dropdowns with the <select>
tag.
β Use selectByVisibleText()
, selectByIndex()
, selectByValue()
for selecting options.
β Use JavaScript or XPath for custom dropdowns that do not use <select>
.
β Check isMultiple()
to verify if a dropdown supports multiple selections.
β Use getOptions()
to fetch all available values in a dropdown.
Now, you can confidently automate dropdowns in Selenium WebDriver! ππ₯