CODEWITHSUNDEEP
c#seleniumtelerikwebdriverselenium-webdriver
Supriya Dsouza Hogen Esch
Supriya Dsouza Hogen Esch

Reputation: 41

How does one work with Telerik dropdowns in Selenium?

I have just started using Selenium Webdriver. But am stuck with Telerik drop downs.

I cannot use SelectElement, because the dropdown appears in a span element. How do I read all available options in the dropdown and then make the selection.

Adding more information: The dropdown is populated by JSON/JQuery. The HTML sample is below. The text between the span elements changes depending on what you have selected from the dropdown. All options from the dropdown are not available anywhere in the generated HTML. 

<div class="t-dropdown-wrap t-state-default">
<span class="t-input">To be approved</span>

My guess is I have to execute javascript. Unsure how to go about it.

Upvotes: 2

Views: 1822

Answers (2)

user26317125
user26317125

Reputation: 1

click on the dropdown , locate the unique identifier for all the list, store all such elements in a list and then access the required.

Upvotes: 0

James Dunn
James Dunn

Reputation: 8284

Your question has two parts:

  1. Generally: Selecting WebElements within other WebElements
  2. Specifically: Reading all options in the dropdown and selecting one of them

While answering, I will assume you have a WebDriver object named "Driver".

Selecting WebElements within other WebElements

First off, I'm not sure why you mentioned SelectElement -- I believe the method you want is FindElement().
You can call FindElement() off of any SearchContext. A WebDriver object is a SearchContext, so you can (theoretically) find a WebElement anywhere on the page by calling Driver.FindElement().
A WebElement itself is also a SearchContext, so you can also call .FindElement() off of a WebElement that you've already found. This is useful for narrowing the search down from the entire page to within a specific element.

Reading All Options in the Dropdown and Selecting One of Them

I looked up an example of a Telerik Dropdown to see what you might be dealing with. I found one here.

First, you need to open the drop down by clicking on the down arrow icon. It seems that the icon is coded like this:

<span class="rddlIcon"></span>

If there's only one of these on the page, you can find it and click it like this:

Driver.FindElement(By.ClassName("rddlIcon")).Click();

It seems that the Dropdown code looks like this:

<ul class="rddlList">
   <li class="rddlItem">Item One</li>
   <li class="rddlItem">Item Two</li>
   <li class="rddlItem">Item Three</li>
</ul>

What you want to do here is select the <ul> WebElement, and then from there find the list item you want.

WebElement List = Driver.FindElement(By.ClassName("rddlList"));
//Get Item Three
WebElement Item = List.FindElement(By.XPath("//li[text()='Item Three']");
Item.click();

Upvotes: 4

Related Questions