Take the 2-minute tour ×
Software Quality Assurance & Testing Stack Exchange is a question and answer site for software quality control experts, automation engineers, and software testers. It's 100% free, no registration required.

I'm not being able to select a value from a Kendo's dropdown, this is the code (C#):

var select = FindElement(By.Id("Type"));
select.SelectByValue("HouseHold");

That's not the selenium raw api, I'm wrapping it up. In this case, FindElement() returns a SelectElement, but when I try to select a value nothing happens on my target web-app (I don't get any code exception, the test succeeds). I believe that Selenium does not support this Kendo UI control, is there a recommended way to handle not supported UI elements like this one?

Edit:

        <ul class=" gs-container">
          <li class="gs-3 gs">
          <label for="Type">Type *</label>
          <select class="selId-28150fa4-9183-4b25-b149-ba1f72d72a93" data-val="true" data-val-required="The field Type is required"
          id="Type" name="Type">
            <option value="Individual">Individual</option>
            <option value="HouseHold">HouseHold</option>
            <option value="Business">Business</option>
          </select> 
          <script type="text/javascript">
$(&quot;select.selId-28150fa4-9183-4b25-b149-ba1f72d72a93&quot;).kendoDropDownList();
</script></li>
        </ul>
share|improve this question
    
Please provide link to the page or relevant HTML. –  Željko Filipin Jan 4 '13 at 9:40
    
@ŽeljkoFilipin there you go, hope that helps –  ggiunta Jan 4 '13 at 13:57
add comment

2 Answers

up vote 1 down vote accepted

I find it easiest to automate the KendoUI DropDownList using javascript. As an added bonus, this makes it work with PhantomJS.

public static void KendoSelectByValue(this IWebDriver driver, IWebElement select, string value)
{
    var selectElement = new SelectElement(select);
    for (int i = 0; i < selectElement.Options.Count; i++)
    {
        if (selectElement.Options[i].GetAttribute("value") == value || selectElement.Options[i].GetAttribute("text") == value)
        {
            var id = select.GetAttribute("id");
            ((IJavaScriptExecutor)driver).ExecuteScript(String.Format("$('#{0}').data('kendoDropDownList').select({1});", id, i));
            break;
        }
    }
}
share|improve this answer
    
Just curious, is there a reason why Webdriver's SelectByValue method or clicking directly on the Option wouldn't work? –  Sam Woods Jan 9 '13 at 17:19
    
Just because of how the Kendo UI DropDownList is written. The controls you see on the page aren't actually the select elements. $($('#size')[0][2]).select(); does not work, but $('#size').data('kendoDropDownList').select(2); does. Click just appears to open the drop down, not select anything. –  Jason Dove Jan 10 '13 at 18:08
    
I'm still not sure what you mean. By "The controls you see on the page" what are you referring to? Once the JavaScript executes and you are looking at the DOM loaded in the browser, it for sure is just a select element with option elements as children. –  Sam Woods Jan 10 '13 at 19:23
    
If you look at the demo page I linked, the drop downs on that page are not select elements, they are styled spans. The underlying select has display: none. The "user" that Selenium is simulating has no ability to click on the select itself because it is never displayed. –  Jason Dove Jan 10 '13 at 19:35
    
The code sample in the OP may be misleading because the .kendoDropDownList() method hides the select element and adds its own KendoUI-styled span elements, so it isn't just a select anymore. –  Jason Dove Jan 10 '13 at 19:39
show 1 more comment

First, Kendo UI (or any ajax library, or asp, or etc) makes no difference to Selenium since all it does is generate HTML and Selenium interacts directly with the HTML/DOM. If Selenium does not work with this select box, it would be a Selenium bug with any UI, not just Kendo UI.

Does something like this work?

        ReadOnlyCollection<IWebElement> options = select.FindElements(By.TagName("option"));
        IWebElement matchingOption = options.FirstOrDefault(opt => opt.GetAttribute("value") == "HouseHold");
        if (matchingOption == null)
        {
            throw new Exception("The option was not found in the ComboBox");
        }
        matchingOption.Click();
share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.