Handling Non-Select or Any Types Of dropdown In Selenium Webdriver

Selenium WebDriver provides a special class called Select which can be used only for drop down created using Select tag. You can not use this class methods for a Non-Select drop downs. This is a major limitation of Select class.

Drop downs in a website could be created in multiple ways. You will find maximum drop downs are created using ul and li tags. There are many drag and drop front end development tools which generates drop down codes dynamically. Sometimes you need to mouse hover on an element to see drop down options. In short, there should be a common way to handle any or most of drop down.

In this post, I will explain some common ways to handle any type of drop downs.

Click on drop down and iterate through options

This is a very common logic I see around. Steps are simple as below:-

1. Click on drop down to make options visible.
2. Get all options of drop down.
3. Iterate through it and match with option to be selected.
4. If found then click on option for selection.

Code snippet

package HandlingDropDowns;

import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

import io.github.bonigarcia.wdm.WebDriverManager;

public class SelectOpionInDropDownUsingIteration {

	@Test
	public void iterateOverOptions() {
		WebDriverManager.chromedriver().setup();
		WebDriver driver = new ChromeDriver();
		driver.get("https://www.facebook.com/");

		// Select Day
		WebElement day = driver.findElement(By.id("day"));
		day.click();
		List allDayDropDownOptions = driver.findElements(By.xpath("//select[@id='day']/option"));
		selectOptionInDropDownUsingIteration(allDayDropDownOptions, "3");

		// Select Month
		WebElement month = driver.findElement(By.id("month"));
		month.click();
		List allMonthDropDownOptions = driver.findElements(By.xpath("//select[@id='month']/option"));
		selectOptionInDropDownUsingIteration(allMonthDropDownOptions, "Aug");

		// Select year
		WebElement year = driver.findElement(By.id("year"));
		year.click();
		List allYearDropDownOptions = driver.findElements(By.xpath("//select[@id='year']/option"));
		selectOptionInDropDownUsingIteration(allYearDropDownOptions, "1990");

	}

	private void selectOptionInDropDownUsingIteration(List dropDownOptions, String optionToBeSelected) {
		boolean isFound = false;
		for (WebElement option : dropDownOptions) {
			if (option.getText().equals(optionToBeSelected)) {
				option.click();
				isFound = true;
				break;
			}

		}
		if (!isFound)
			System.out.println("No matching opion found.");

	}
}

You can write same logic using Sream API as below :-

package HandlingDropDowns;

import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

import io.github.bonigarcia.wdm.WebDriverManager;

public class SelectOpionInDropDownUsingStreamIteration {

	@Test
	public void iterateOverOptionsUsingStream() {
		WebDriverManager.chromedriver().setup();
		WebDriver driver = new ChromeDriver();
		driver.get("https://www.facebook.com/");

		// Select Day
		WebElement day = driver.findElement(By.id("day"));
		day.click();
		List allDayDropDownOptions = driver.findElements(By.xpath("//select[@id='day']/option"));
		selectOptionInDropDownUsingStream(allDayDropDownOptions, "3");

		// Select Month
		WebElement month = driver.findElement(By.id("month"));
		month.click();
		List allMonthDropDownOptions = driver.findElements(By.xpath("//select[@id='month']/option"));
		selectOptionInDropDownUsingStream(allMonthDropDownOptions, "Aug");

		// Select year
		WebElement year = driver.findElement(By.id("year"));
		year.click();
		List allYearDropDownOptions = driver.findElements(By.xpath("//select[@id='year']/option"));
		selectOptionInDropDownUsingStream(allYearDropDownOptions, "1990");

	}

	private void selectOptionInDropDownUsingStream(List dropDownOptions, String optionToBeSelected) {
		// anyMatch() method will not continue once rue is returned unlike forEach where we can not break loop.
		dropDownOptions.stream().anyMatch(option -> {
			if (option.getText().equals(optionToBeSelected)) {
				option.click();
				return true;
			} else
				return false;
		});

	}
}

Problem in above logic is that it is not optimal as it need to iterate over options. If your desired option to be selected in the list is at bottom position then whole options will be iterated and that will be a performance impact.

Optimal logic to select value in drop down without iteration

1. Click on drop down to make options visible.
2. Create a custom locator using option to be selected.
3. Locate it and select.

Code Snippet

package HandlingDropDowns;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

import io.github.bonigarcia.wdm.WebDriverManager;

public class SelectOpionInDropDownWithoutIteration {

	@Test
	public void iterateOverOptions() {
		WebDriverManager.chromedriver().setup();
		WebDriver driver = new ChromeDriver();
		driver.get("https://www.facebook.com/");

		// Select Day
		WebElement day = driver.findElement(By.id("day"));
		day.click();
		selectOptionUsingCustomLoc(driver, "3");

		// Select Month
		WebElement month = driver.findElement(By.id("month"));
		month.click();
		selectOptionUsingCustomLoc(driver, "Aug");

		// Select year
		WebElement year = driver.findElement(By.id("year"));
		year.click();
		selectOptionUsingCustomLoc(driver, "1990");

	}

	private void selectOptionUsingCustomLoc(WebDriver driver, String valueToBeSelected) {
		String customLoc = "//option[text()='" + valueToBeSelected + "']";
		driver.findElement(By.xpath(customLoc)).click();
	}

}

You can download/clone above sample project from here.

If you have any doubt, feel free to comment below.
If you like my posts, please like, comment, share and subscribe.
#ThanksForReading
#HappyLearning

Find all Selenium related post here, all API manual and automation related posts here and find frequently asked Java Programs here.

Many other topics you can navigate through menu.