How to find drop down web element on the page using selenium locators

In this article, I am going to explain to you, how to find out drop down element on the page using selenium locators, the first thing which I am going to do in my selenium test script is importing below package

1	import org.openqa.selenium.support.ui.Select;

Finding Element

Using id attribute, I am going to find out the drop down element on the page, here I am using annotations to find out the element but, you can use driver.findElement(By.name(“country”)), I am using name locator here to find out country

1 2	@FindBy(id = "country") WebElement country;

The HTML for drop-down list is different than the normal HTML controls and it looks something like below, here every option you see in the below HTML contains a value attribute and option text which is in between options tags

<option value="china-value">China</option>

<option value="india-value">India</option>

<option value="japan-value">Japan</option>

</select>

Selenium dropdown selection

Using select class which we imported earlier will be used to select the options tags first

1 2	Select country= new Select(country); country.selectVisibleText("India");

If you want to find out by text then you need to use below code

1	country.selectVisibleText("India");

If you want to find out by value then you need to use below code

1	country.selectVisibleByValue("india-value")

If you want to find out by index then use below

1	country.selectVisibleIndex(2) // this will select china in dropdwon list

Selenium dropdown deselection

If you want to deselect the text which was already selected then you need to use below code

1	country.deselectByVisibleText("India");

If you want to deselect by value then you need to use below code

1	country.deselectVisibleByValue("india-value")

If you want to deselect by index then use below

1	country.deselectVisibleIndex(2) // this will de-select china in dropdwon list

Selenium dropdown multiselection

You can use combination to select multiple items in the dropdown list, check below code, it will select India and china items in the dropdown list

1 2	country.selectVisibleByValue("india-value") country.selectByIndex(2)

Dropdown selection example

I am going to test facebook registration date of birth drop-down list by using below code

package com.wyn.aem.utils.test;

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 org.testng.annotations.AfterSuite;
import org.testng.annotations.BeforeSuite;
import org.testng.annotations.Test;

public class SearchTest {

public static void main(String[] args) {

System.setProperty("webdriver.chrome.driver", "C:\\chromedriver.exe");

WebDriver driver = new ChromeDriver();
		driver.get("https://www.facebook.com/");
		WebElement birthYear = driver.findElement(By.name("birthday_year"));
		WebElement birthDay = driver.findElement(By.name("birthday_day"));
		WebElement birthMonth = driver.findElement(By.name("birthday_month"));
	
		Select birthSelection = new Select(birthYear);
		Select birthDaySelection = new Select(birthDay);
		Select birthMonthSelection = new Select(birthMonth);
		
		birthSelection.selectByVisibleText("2015");
		birthDaySelection.selectByIndex(2);
		birthMonthSelection.selectByValue("2");

driver.manage().window().maximize();
	}

}

package com.wyn.aem.utils.test;

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 org.testng.annotations.AfterSuite;

import org.testng.annotations.BeforeSuite;

import org.testng.annotations.Test;

public class SearchTest {

public static void main(String[] args) {

System.setProperty("webdriver.chrome.driver", "C:\\chromedriver.exe");

WebDriver driver = new ChromeDriver();

driver.get("https://www.facebook.com/");

WebElement birthYear = driver.findElement(By.name("birthday_year"));

WebElement birthDay = driver.findElement(By.name("birthday_day"));

WebElement birthMonth = driver.findElement(By.name("birthday_month"));

Select birthSelection = new Select(birthYear);

Select birthDaySelection = new Select(birthDay);

Select birthMonthSelection = new Select(birthMonth);

birthSelection.selectByVisibleText("2015");

birthDaySelection.selectByIndex(2);

birthMonthSelection.selectByValue("2");

driver.manage().window().maximize();

}

After executing above selenium drop-down selection code, the date of birth on the registration page of the facebook will be populated something like below

Keys and Strokes

Technology Blog