Question

I’m trying to “record” a functional test using the selenium IDE plugin for Firefox (version 3.6). Im using the jQuery plugin ui selectmenu (I think its version 1.8). Im trying to “record” the selection of an element in a dropdown / select component. This dropdown is a ui select enhanced component. Therefore the actual select element is hidden and you end up selecting span elements and something else. This is what selenium records:

<tr>
   <td>click</td>
   <td>//a[@id='type-button']/span[2]</td>
   <td></td>
</tr>
<tr>
    <td>click</td>
    <td>ui-selectmenu-item-416</td>
    <td></td>
</tr>

The problem is that the second part uses a number suffix, a kind of counter (416). This value is different for every page load, and therefore I don’t see how I can automate it!?

How can I get a predictable result and test this?, or is there some other way to do it?

thanks!

Answer 1

The jQuery selectmenu widget is painful to automate with Selenium. A simple record-playback will hardly ever work. Try the following steps to automate the selection –

1. Type in the item you need to select.

2. Hit Backspace so the selectBox can “search” for the item.

3. Simulate the down arrow key for the searched item.

4. Select the first item from the dropdown list.

Here is the source code (in Java) for these steps. You should be able to adapt these to the IDE.

selenium.type("selectMenu_descriptor", "item_to_be_selected");
selenium.typeKeys("selectMenu_descriptor", "\b"); 
selenium.keyDown("selectMenu_descriptor", "\\40");
selenium.click("css=a.ui-corner-all[tabindex=\"-1\"]");