Select an option using Watin

Question

I'm attempting to select an item in the first asset selection pulldown from this page using Watin but can't get anything to work.

This example link has practically the same control and the code works perfectly Watin can't select an option from a select list

However, attempting to apply the same logic does find the correct elements but nothing is selected. Please can someone help identify why this is not working?

[Test]
public void ChosenTest()
{
    IE myIE = new IE(true);
    myIE.GoTo("http://www.marketoptions.com/trading-platform/");

    myIE.SelectList(Find.ByClass("assetSelect chzn-ltr chzn-done")).WaitUntilExists(); 

    string id = myIE.SelectList(Find.ByClass("assetSelect chzn-ltr chzn-done")).Id;
    myIE.Div(id + "_chzn").Div(Find.ByClass("chzn-drop")).ElementWithTag("li", Find.ByIndex(7)).Click();
    myIE.Div(id + "_chzn").Links[0].Spans[0].Click(); 
}

Edit: It looks like the css styling is having some affect which is not allowing Watin to click or select the standard html control. I'll offer a bounty once allowed if anyone can produce a working test that will select an item from the asset pulldown and explain why the current code does not work.

Answer 1

I've spent a while looking at this and think the problem boils down to the fact that you are using an ajax control which actually replaces the select list with dynamically generated html instead. In fact the original select gets hidden, which makes it problematic to change.

The way I have worked around this type of problem in the past is to use the ajax controls javascript API to set the value and then trigger it's methods by using Watin to execute scripts.

Here is my code:

IE myIE = new IE();
myIE.GoTo("http://www.marketoptions.com/trading-platform/");

myIE.SelectList(Find.ByClass("assetSelect chzn-ltr chzn-done")).WaitUntilExists();

// remove the currently selected value
myIE.DomContainer.Eval("$('td.assetControl select option').removeAttr('selected');");

// set the new selected value
myIE.DomContainer.Eval("$('td.assetControl select option:contains(EUR/JPY)').attr('selected', 'selected');");

// update the ajax control to refresh the UI
myIE.DomContainer.Eval("$('td.assetControl select').trigger('liszt:updated');");

// sit back and enjoy the view as you hopefully see the UI showing the value that you wanted :)
Thread.Sleep(8000);

Obviously you will need to change EUR/JPY to the value you want.

Also, notice that I am using td.assetControl select as the selector. This assumes it is the only select in this cell. The selector you are using actually finds 4 matches when I first tried this in the browser. So maybe that was causing some problems too. There is actually an id on the select you can use if you think it is likely to stay the same (it looks like it might be auto generated though)

Hopefully this will work for you! let me know how you get on.

Answer 2

It seems that javascript or jquery event is binded with that drop down. try using eval.

Find the link by class.

var link = myIE.Link(Find.ByClass("chzn-single"));

link.DomContainer.Eval("$('chzn-single').click();");

Try this link this may help http://thecuttingledge.com/?p=328

Answer 3

i use this codes for find select list and select an option in it

IE browser=new IE();
var slist = browser.SelectList(Find.ById("the id of select list"));
slist.Option(Find.ByValue("1")).Select();

Answer 4

you don't need to complicate thing like this, manually making the id by combing the strings etc.

I can't access the website you mentioned in your example but selecting a option from the select list should be fairly simple

        //Find select list.
        var option= browser.SelectList(Find.ById("sbxControlID2"));
        if (!option.Exists)
        {
          //log error 
        }
       //find it by inspecting the select list with fire bug or any other inspection tool
        option.Select("Select option value here");

What you need to put in option.Select("SelectValue"), you can use the firebug to check the value of the option from the select list and put that value in there

The following code i have tested to select the product type dropdown from amazon's website

        //Find select list.
        var option= browser.SelectList(Find.ById("searchDropdownBox"));
        if (!option.Exists)
        {
          //log error 
        }
        option.Select("search-alias=arts-crafts");//This select arts and crafts option

Answer 5

public void ChosenTest() {
   IE myIE = new IE(true);
   myIE.GoTo("http://www.marketoptions.com/trading-platform/");

   var slist = myIE.SelectList(Find.ById("country")); 

   //for select France in list 

   slist.Option(Find.ByValue("FR")).Select(); 
}