Jaffar Lone
Jaffar Lone

Reputation: 73

Unable to access element of the dropdown using selenium webdriver

I am trying to access the dropdown's element, html is as follows:

<ul class="select2-results" role="listbox" id="select2-results-3">
<li class="select2-results-dept-0 select2-result select2-result-selectable select2-highlighted" role="presentation">
	<div class="select2-result-label" id="select2-result-label-5" role="option">
		<span class="select2-match"></span>Select the category of your business.
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-6" role="option">
		<span class="select2-match"></span>Attractions/Things To Do
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-7" role="option">
		<span class="select2-match"></span>Bank
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-8" role="option">
		<span class="select2-match"></span>Bar
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-9" role="option">
		<span class="select2-match"></span>Book Store
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-10" role="option">
		<span class="select2-match"></span>Concert Venue
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-11" role="option">
		<span class="select2-match"></span>Food/Grocery
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-12" role="option">
		<span class="select2-match"></span>Hotel
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-13" role="option">
		<span class="select2-match"></span>Local Business
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-14" role="option">
		<span class="select2-match"></span>Movie Theatre
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-15" role="option">
		<span class="select2-match"></span>Museum/Art Gallery
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-16" role="option">
		<span class="select2-match"></span>Outdoor Gear/Sporting Goods
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-17" role="option">
		<span class="select2-match"></span>Real Estate
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-18" role="option">
		<span class="select2-match"></span>Restaurant/Cafe
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-19" role="option">
		<span class="select2-match"></span>School
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-20" role="option">
		<span class="select2-match"></span>Shopping/Retail
	</div>
</li>
<li class="select2-results-dept-0 select2-result select2-result-selectable" role="presentation">
	<div class="select2-result-label" id="select2-result-label-21" role="option">
		<span class="select2-match"></span>Spas/Beauty/Personal Care and many more.
	</div>
</li>
</ul>

The code that i am using is:

WebElement dr = driver.findElement(By.xpath("//*[@id =\"select2-chosen-3\"]"));
    dr.click();

 List<WebElement> options = driver.findElements(By.xpath("//*[@id=\"category\"]"));  
        for(WebElement option : options) {
            if(option.getText().trim().contains("Shopping/Retail")) {
                option.click();
            }
        }

The problem is that it keeps selecting 'Bank' from the drop-down instead of 'Shopping/Retail'

Upvotes: 0

Views: 1072

Answers (4)

Fury
Fury

Reputation: 142

You could select a value from the drop down using below ways:

1) by directly passing the value "Shopping/Retail" using sendkeys() method

2)If above doesn't work use select class:

first inspect the dropdown box and store in a webElement:

WebElement business=driver.findElementby*("");
Select dropDown=new Select(business);

then you could using three methods:

 dd.selectByIndex(14); //seems to be the 15th value in drop down
 dd.selectByText("Shopping/Retail");

3).Using actions class

If these didn't workout, post your queries.

Upvotes: 1

undetected Selenium
undetected Selenium

Reputation: 193058

As per the HTML you have shared and your code trials to invoke click() on the element with text as Shopping/Retail once the dropdown is accessed, you can use the following solution:

List<WebElement> options = driver.findElements(By.xpath("//ul[@class='select2-results' and @id='select2-results-3']//li[contains(@class,'select2-result-selectable')]/div[@class='select2-result-label'][contains(@id,'select2-result-label-')]"));  
for(WebElement option : options) {
    if(option.getText().contains("Shopping/Retail")) {
        option.click();
        break;
    }
}

Upvotes: 1

NarendraR
NarendraR

Reputation: 7708

Try below code to select your desired element :

driver.findElement(By.id("select2-results-3")).click();

driver.findElement(By.xpath("//ul[@id='select2-results-3']//div[contains(.,'Shopping/Retail')]")).click();

also you can loop through the all element and once it found the click on that:

List<WebElement> all = driver.findElements(By.cssSelector('#select2-results-3 li .select2-result-label'));

for(int i=0;i<all.size();i++){
    if(all.get(i).getText().contains("Shopping/Retail")){
    all.get(i).click();
    break;
    }

}

Let me know if anything there.

Upvotes: 1

Rajagopalan
Rajagopalan

Reputation: 6064

Okay, I think I understand what you are asking. First of all click that select_list, now the drop down will pop up with sets of options, now you write this code immediately after the click of the select_list.

driver.findElement(By.xpath("//ul[@id='select2-results-3']/li/div/span[normalize-space()='Attractions/Things To Do']")).click();

If you want to change the element then change the text Attractions/Things To Do with your required text, it would work for you.

Upvotes: 1

Related Questions