How to Handle Dropdown without Select in Selenium I How to Handle Bootstrap dropdown without Select Class

 
 
 

In this tutorial, we will see “How to handle dropdown without select in Selenium with Java”.

In this tutorial, I am not going to select dropdown value using Select class. I will follow some below steps to select any value from dropdown without using Select class.

How to Handle Dropdown without Select in Selenium:

Steps:

  1. Go to a site – http://demo.guru99.com/test/newtours/register.php
  2. Click on dropdown web element.
  3. Store all dropdown options into List
  4. Fetch all options using for loop
  5. Using if condition we can select desire option.

Selenium Code –

package datapkg;

import java.awt.AWTException;
import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.interactions.Actions;

public class SelectDropDownV {
	
	
	public static void main(String[] aa) throws AWTException, InterruptedException {
		System.setProperty("webdriver.chrome.driver", "C:\\Users\\AJEET\\Downloads\\chromedriver_win32\\chromedriver.exe");
		WebDriver driver = new ChromeDriver();
		driver.get("http://demo.guru99.com/test/newtours/register.php");
		driver.manage().window().maximize();
		
		Thread.sleep(3000);
		//scroll down the page
		
		JavascriptExecutor js = (JavascriptExecutor)driver;
		js.executeScript("window.scrollBy(0,500)");
		
		//Click on Country Dropdown
 
		driver.findElement(By.name("country")).click();
		
		List<WebElement> allOptions = driver.findElements(By.xpath("//select[@name='country']//option"));
		System.out.println(allOptions.size());
		
				
				
		for(int i = 0; i<=allOptions.size()-1; i++) {
			
			
			if(allOptions.get(i).getText().contains("ANGOLA")) {
				
				allOptions.get(i).click();
				break;
				
			}
		}
		
}

}

Note: Same logic will work in Bootstrap dropdown.


How To Handle Dropdown Value in Selenium:

In Selenium, It defined a class Select which is used to select the dropdown value and implement the HTML SELECT tag . When we inspect the dropdown then we can see the Select tag in html view.

Syntax –

Select s = new Select(WebElement);
s.selectByIndex(1); 

Let’s see how it looks like in html view –

How to Handle Dropdown without Select in Selenium
Select Tag with Options

You can see in html, the dropdown has tag name ‘Select’. Now how we can select these values.

There are different methods defined in Select class. These are as follows-

1.selectByVisibleText() – Select the value based on visibility of the text.

2. selectByValue() –  Select the option based on selecting  html value. See below image

Select Tag

3. selectByIndex() – Select the option based on given index.  Example – If you want to select first option from dropdown then index will be 0. Same like for second option index will be 1 etc.

4. isMultiple() – It return true or false if drop down allow multiple selections at a time.

5. deselectAll() – It deselect all selected options.

Same like we have deselectByVisibleText(), deselectByValue() and deselectByIndex()  methods to deselect the dropdown options.

Let’s see one Scenario then we can understand more.

Scenario:

1.Go to a site – http://demo.guru99.com/test/newtours/register.php

2.Select first value from dropdown list.

 

Selenium Code –

package datapkg;

import java.awt.AWTException;
import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.interactions.Actions;
import org.openqa.selenium.support.ui.Select;

public class SelectDropDownV {
	
	
	public static void main(String[] args) throws AWTException, InterruptedException {
		System.setProperty("webdriver.chrome.driver", "C:\\Users\\AJEET\\Downloads\\chromedriver_win32\\chromedriver.exe");
		WebDriver driver = new ChromeDriver();
		driver.get("http://demo.guru99.com/test/newtours/register.php");
		driver.manage().window().maximize();
		
		Thread.sleep(3000);
		//scroll down the page
		
		JavascriptExecutor js = (JavascriptExecutor)driver;
		js.executeScript("window.scrollBy(0,500)");
		
		//Click on Country Dropdown
 
		WebElement ele= driver.findElement(By.name("country"));
		
		//SELECT VALUE FROM DROPDOWN LIST using selectByValue method
		
		Select s = new Select(ele);
		s.selectByValue("ANGOLA");



           // Same like using selectByIndex method

             Select s1 = new Select(ele);
		s1.selectByIndex(4);


          // Same like using selectByvisibleText method

             Select s2 = new Select(ele);
		S2.selectByVisibleText("ANGOLA");



}

}


Code explanation –

Line no. 26  scroll the page to see the dropdown list.

Line no. 31 store the dropdown element into WebElement ele.

Line no. 35 create the object of Select class and pass the dropdown web-element reference .

Line no. 36 Using Select class object, call the method ‘selectByValue()’ and pass the index value.


Must Read:

Mostly Asked Selenium Interview Questions

Top 30 TestNG Interview Questions


Count the total number of options in a drop-down

To find the total number of options from dropdown, using getOptions() and size() method we can do that.

Selenium Code-

package datapkg;

import java.awt.AWTException;
import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.interactions.Actions;
import org.openqa.selenium.support.ui.Select;

public class SelectDropDownV {
	
	
	public static void main(String[] args) throws AWTException, InterruptedException {
		System.setProperty("webdriver.chrome.driver", "C:\\Users\\AJEET\\Downloads\\chromedriver_win32\\chromedriver.exe");
		WebDriver driver = new ChromeDriver();
		driver.get("http://demo.guru99.com/test/newtours/register.php");
		driver.manage().window().maximize();
		
		Thread.sleep(3000);
		//scroll down the page
		
		JavascriptExecutor js = (JavascriptExecutor)driver;
		js.executeScript("window.scrollBy(0,500)");
		
		//Click on Country Dropdown
 
		WebElement ele= driver.findElement(By.name("country"));
		
		//SELECT VALUE FROM DROPDOWN LIST
		
		Select s = new Select(ele);
		List allOptions = s.getOptions();
		 
		System.out.println(allOptions.size());
		
		
		
		
		

}

}


Code explanation –

Line no.  Using getOptions()  – Get the all options into List.

Line no.  using size() – get the size and print it.


How To handle AngularJs dropdown in Selenium:

To select the value from angularjs dropdown, firstly enter the xpath of dropdown then xpath of the search box.

Actually AngularJs uses ng attributes which are present in Selenium libraries, So you can face issues with these types of attributes.

To handle AngularJs based application using Protractor tool or ngWebDriver library.


How To handle dropdown with div tag in Selenium:

Selenium Webdriver provides a ‘Select’ class which can be only use where Select tag used for dropdown.

We cannot use Select class where dropdown is created without select tag. This is the limitation of Select class.

For handling this scenario, we will click on dropdown and get the all options then Iterate options using for loop and select desired options.

Selenium Code

package datapkg;

import java.awt.AWTException;
import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.interactions.Actions;

public class SelectDropDownV {
	
	
	public static void main(String[] args) throws AWTException, InterruptedException {
		System.setProperty("webdriver.chrome.driver", "C:\\Users\\AJEET\\Downloads\\chromedriver_win32\\chromedriver.exe");
		WebDriver driver = new ChromeDriver();
		driver.get("http://demo.guru99.com/test/newtours/register.php");
		driver.manage().window().maximize();
		
		Thread.sleep(3000);
		
		//Click on Country Dropdown
 
		driver.findElement(By.name("country")).click();
		
		List<WebElement> allOptions = driver.findElements(By.xpath("//select[@name='country']//option"));
		System.out.println(allOptions.size());
		
				
				
		for(int i = 0; i<=allOptions.size()-1; i++) {
			
			
			if(allOptions.get(i).getText().contains("ANGOLA")) {
				
				allOptions.get(i).click();
				break;
				
			}
		}
		
	
		

}

}





How To Handle dynamic Dropdown in Selenium WebDriver

Before handling dynamic dropdown, first we should know what dynamic dropdown is.

Sometimes we have seen when we select dropdown value then second dropdown is got populated.

Example1– In case of selecting city of any state. After selected state from dropdown, city dropdown get populated.

Example2– On https://www.spicejet.com/default.aspx. First we need to enter departure city otherwise Arrival city would be blank. See in below image.

How to handle dynamic dropdown in selenium

How To Automate Dynamic Drop Down Using Selenium

Here we will automate dropdown of From and To on below site.

 https://www.spicejet.com/default.aspx

Step 1: First we need to select City of From dropdown.

In this step we will find the xpath of From drpdown then find the xpath of any City.

Xpath of dropdown– //input[@id=’ctl00_mainContent_ddl_originStation1_CTXT’]

Xpath of Goa city – //a[contains(text(), ‘GOI’)]

After selection of above City of From dropdown, To dropdown will get populated.

Step 2: Now select city from TO dropdown.

Xpath of To dropdown – //input[@id=’ctl00_mainContent_ddl_destinationStation1_CTXT’]

At the time of selection of City from TO dropdown there are two web element found. You can see in below image 1 of 2 element is matched so it will not work because if we have given the duplicate xpath selenium select the web-element which comes first. So it will select the city from FROM dropdown. See in below image.

So here we will use indexing in Xpath.

Xpath of City : //a[@value=’COK’][1]//following::a[@value=’CCU’][2]

Code:

package datapkg;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;

public class DynamicDropdown {
    

    public static void main(String[] args) throws InterruptedException {
        
        
    System.setProperty("webdriver.chrome.driver", "E:\\Selenium\\chromedriver_win32\\chromedriver.exe");
    WebDriver driver = new ChromeDriver();
    driver.get("https://www.spicejet.com/default.aspx");
    driver.manage().window().maximize();
    
    //From dropdown
    driver.findElement(By.xpath("//input[@id='ctl00_mainContent_ddl_originStation1_CTXT']")).click();
    driver.findElement(By.xpath("//a[contains(text(), 'GOI')]")).click();
    
    //To Dropdown
    Thread.sleep(2000);
    driver.findElement(By.xpath("//input[@id='ctl00_mainContent_ddl_destinationStation1_CTXT']")).click();
    driver.findElement(By.xpath("//a[@value='COK'][1]//following::a[@value='CCU'][2]")).click();
    Thread.sleep(2000);
        
   }
}

 


How to get the selected value of dropdown in Selenium webdriver

Follow below steps to find the selected value from dropdown.

1. Create object of Select class and pass webelement in this.

     WebElement dropdown=driver.findElement(By.xpath(“//select[@name=’country’]”));

     Select sc = new Select(dropdown);

2. In Select class there is a method getFirstSelectedOption(). Using this we can get first selected option.

3. Using getText() method we can find the text value of this option.

      String option=sc.getFirstSelectedOption().getText();

4. Print this value.

     String option=sc.getFirstSelectedOption().getText();

    System.out.println(option);

Code:

package datapkg;

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 DynamicDropdown {
    

    public static void main(String[] args) throws InterruptedException {
        
        
    System.setProperty("webdriver.chrome.driver", "E:\\Selenium\\chromedriver_win32\\chromedriver.exe");
    WebDriver driver = new ChromeDriver();
    driver.get("http://demo.guru99.com/test/newtours/register.php");
    driver.manage().window().maximize();
    
    //From dropdown
    WebElement dropdown=driver.findElement(By.xpath("//select[@name='country']"));
    Select sc = new Select(dropdown);
    String option=sc.getFirstSelectedOption().getText();
    System.out.println(option);

}}

 

Watch this video for more clarification


Summary:

In this post, we have covered ‘How to Handle Dropdown without Select in Seleniumand it’s methods and how to use it.

We have also covered – How to Handle Dropdown Value in Selenium, Count the total number of options in a drop-down, How to handle AngularJs dropdown in Selenium, How to handle AngularJs dropdown in Selenium and How to handle dropdown with div tag in Selenium.

I am sure this content added some additional value in your skills and also helpful to preparation of your interviews.

Final word, Bookmark this post How to Handle Dropdown without Select in Selenium for future reference.

If you have other questions or feedback, the comment section is yours. Don’t forget to leave a comment below!

Leave a Comment