Webdriver SELECT Methods to work with Dropdowns

WebDriver’s support classes called “Select”, which provides useful methods for interacting with select options. User can perform operations on a select dropdown and also de-select operation using the below methods.

Method Name: selectByIndex 

Syntax: select.selectByIndex(Index);
Purpose:  To Select the option based on the index given by the user.
There is an attribute called "values" which will have the index values.

The below is the sample html code using index
Example
HTML Code

<html>
<head>
<title>Select Example by Index value</title>
</head>
<body>
<select name="Mobiles"><option value="0" selected> Please select</option>
<option value="1">iPhone</option>
<option value="2">Nokia</option>
<option value="3">Samsung</option>
<option value="4">HTC</option>
<option value="5">BlackBerry</option>
</select>
</body>
</html>

Webdriver code for Selecting a Value using select.selectByValue(Value);

public class selectByIndexExample {
	WebDriver driver;
	@Test
	public void selectSamples()
	{
		driver = new FirefoxDriver();
		driver.get("C:\\Users\\DEV\\Desktop\\html-and-css-code-samples\\Final Code\\chapter-07\\dropdown-select.html");
		WebElement element=driver.findElement(By.name("Mobiles"));
		Select se=new Select(element);
		se.selectByIndex(1);
	}
}

Method Name: selectByValue 

 
Syntax: select.selectByValue(Value);
Purpose:  To Select the options that have a value matching with the given argument by the user.

Example:
HTML Code:

<html>
<head>
<title>Select Example by Value</title>
</head>
<body>
<p>Which mobile device do you like most?</p>
<select name="Mobiles"><option selectd> Please select</option>
<option value="iphone">iPhone</option>
<option value="nokia">Nokia</option>
<option value="samsung">Samsung</option>
<option value="htc">HTC</option>
<option value="blackberry">BlackBerry</option>
</select>
</body>
</html>

Webdriver code for Selecting a Value using select.selectByValue(Value);

public class selectExamples {
	WebDriver driver;
	@Test
	public void selectSamples()
	{
		driver = new FirefoxDriver();
		driver.get("C:\\Users\\DEV\\Desktop\\html-and-css-code-samples\\Final Code\\chapter-07\\dropdown-select.html");
		WebElement element=driver.findElement(By.name("Mobiles"));
		Select se=new Select(element);
		se.selectByValue("nokia");
	}
}

Method Name: selectByVisibleText 

Syntax: select.selectByVisibleText(Text);
Purpose: To Select all options that display text matching the given argument. It will not look for any index or value, it will try to match the VisibleText (which will display in dropdown)

Example: Any of the above html code can be taken as example.

Webdriver example code to select the value by Visible text.

public class selectExamples {
	WebDriver driver;
	@Test
	public void selectSamples()
	{
		driver = new FirefoxDriver();
		driver.get("C:\\Users\\DEV\\Desktop\\html-and-css-code-samples\\Final Code\\chapter-07\\dropdown-select.html");
		WebElement element=driver.findElement(By.name("Mobiles"));
		Select se=new Select(element);
		se.selectByVisibleText("HTC");
	}
}

Method Name: deselectByIndex  

Syntax: select.deselectByIndex(Index);
Purpose: To Deselect the option at the given index. The user has to provide the value of index.
Please check for the below example.

Method Name: deselectByValue  

Syntax: select.deselectByValue(Value);
Purpose: To Deselect all options that have a value matching the given argument.
Please check for the below example.

Method Name: deselectByVisibleText  

Syntax: select.deselectByVisibleText(Text); 
Purpose: To Deselect all options that display text matching the given argument.
Please check for the below example.

Method Name: deselectAll

Syntax: select.deselectAll();
Purpose: To Clear all selected entries. This works only when the SELECT supports multiple selections. It throws NotImplemented eError if the "SELECT" does not support multiple selections. In select it mandatory to have an attribute multiple="multiple"
Please check for the below example.

Example::
HTML Code for Multi Select :

<html>
<head>
<title>Multi select Drop Down List Box</title>
</head>
<body>
<p>What all devices do you listen to music on?</p>
<select name="Mobdevices" multiple="multiple"><option value="0" selectd> Please select</option>
<option value="1">iPhone</option>
<option value="2">Nokia</option>
<option value="3">Samsung</option>
<option value="4">HTC</option>
<option value="5">BlackBerry</option>
</select>
</body>
</html>

Webdriver code to show all the above deselect methods.

public class selectExamples {
	WebDriver driver;
	@Test
	public void selectSamples() throws InterruptedException
	{
		driver = new FirefoxDriver();
		driver.get("C:\\Users\\DEV\\Desktop\\html-and-css-code-samples\\Final Code\\chapter-07\\dropdown-select.html");
		WebElement element=driver.findElement(By.name("Mobdevices"));
		Select se=new Select(element);
		//Here we will take multi select dropdown to show you the difference
		se.selectByVisibleText("HTC");
		se.selectByValue("nokia");
		
		//From the above two commands, in the dropdown two values will be selected. 
		//Now we will try to deselect any of the One
		//Im using thread to see the difference when selecting and selecting
		Thread.sleep(3000);
		se.deselectByValue("nokia");

		//You can deselect the value by specifying the index, value and VisibleText
		
		//It will work if you the index is already selected
		se.deselectByIndex(1);
		
		//It will deselect if the visible text HTC is in selected mode
		se.deselectByVisibleText("HTC");
		
		//It will de-select all the values which are selected
		se.deselectAll();
	}
}

Please click the below link for Select options 'Part-2"
Select Options Part -2

Selenium Tutorials: 

Comments

In above program you write hard coded values(like HTC,nokia) it is fine but my question is it is possible to write without hard code. iam giving values from excel or another file by using instances.

POM plays a vital role in selenium Technologies in all MNC companies right now. So emphasize for it more in coding. For the selection code also please post how to implement it in POM. Really it will be useful for amateurists like us.

HI i want to click a value from dropdown by entering text in box which needs to be matched and should pick up from the dropdown

Add new comment