404. Using selectByValue( ) command to select the list option from the Multi Select Box field using the specified value

selectByValue( ) command is used to select the list option using the specified value of the List Option from the multi-selection Box field.

Finding the values of the list options:

Follow the below steps:

1. Open http://compendiumdev.co.uk/selenium/basic_html_form.html in Firefox Browser

2. Ensure that you have FireBug AddOn installed in Firefox Browser (If not installed please read this post # 3 to install it)

3. Select the list option to be selected, Right click on it and select 'Inspect element with Firebug' option as shown below:

4.  Observe that the HTML code of the Inspected List Option gets displayed as shown below:

5. Find out whether the highlighted HTML code has the value attribute or not as shown below:

6. So the value of the List option 'Selection Item 3' is ms3 .


Using selectByValue( ) command:

In order to use the selectByValue( ) command, we have to create an object for Select class of selenium as shown below:

 Select select = new Select(_driver.findElement(By.cssPath("CSS Path of Multi-Select Box field")));

• Here Select is the Class name
• select is the object of Select Class

After creating an object for Select Class, you can get the selectByValue( ) predefined method of Select Class by using its object select as shown below:

select.selectByValue("ms3");  -> This will select the list option 'Selection Item 3'  (i.e. ms3 is the value of the value attribute in the HTML code of this list option)

Note - Before using the above statements for selecting the more than one List options in the Multi-Selection Box field, first lets deselect all the list options as explained in our previous post # 124 using deselectAll( ) command.


Test Description:

Understand the test description by reading the comments mentioned on the below screenshot:

Lets Implement This:

Pre-requisites:

1. Create a new Java Project say 'WebDriver-Project48' in Eclipse IDE
2. Configure the Project to work with Selenium WebDriver
3. Create a package say 'package48' under the newly created project.
4. Create a Java Class file say 'Class48' under the newly created package as shown below:

Actual Steps:

1. Write the following code into the newly created Java Class file as shown below and make sure that you resolve all the errors before going to next step:

2. Write the test method 'selectByValueDemo( )' which uses CSS Path Statement for locating the  Multi-Selection Box field as shown below:

3. Save and Run the 'Class48.java' file by selecting the 'JUnit Test' option and ensure that our Automation Test has selected the list option (i.e. Selection Item 3) using the value of its HTML value attribute 'ms3'  from the Multi-select Box field as shown in the below video:

Watch the below video:

Click here to watch the video.

Download this Project:

Click here to download this project and import into Eclipse IDE  on your machine.

Please comment below to feedback or ask questions.

Using deselectByValue( ) command to deselect the list option from the Multi Select Box field using its value will be explained in the next post.