Selecting a date value from a dynamically generated listbox.

Question

Hi All,

I have a listbox whose values are generated dynamically. The list box contains months and years and when generated looks like this.

<select name="arr_dtm_mon_year" tabindex="150" class="input">
    <option value=""></option>
    <option value="NOV 09">Nov 09</option>
    <option value="DEC 09">Dec 09</option>
    <option value="JAN 10">Jan 10</option>
    <option value="FEB 10">Feb 10</option>
    <option value="MAR 10">Mar 10</option>
    <option value="APR 10">Apr 10</option>
    <option value="MAY 10">May 10</option>
    <option value="JUN 10" selected>Jun 10</option>
    <option value="JUL 10">Jul 10</option>
    <option value="AUG 10">Aug 10</option>
    <option value="SEP 10">Sep 10</option>
    <option value="OCT 10">Oct 10</option>
</select> 

The element in the listbox that is by default selected is the current month. When i use selenium IDE to select from this listbox it works fine. Here are example commands i use to select from the listbox.

<tr>
    <td>select</td>
    <td>arr_dtm_mon_year</td>
    <td>label=Oct 10</td>
</tr>
<tr>
    <td>select</td>
    <td>arr_dtm_mon_year</td>
    <td>label=May 10</td>
</tr>

Now the problem i have is the values in the listbox is dynamically generated. In the above example i selected the option for "May 10". The values that are generated is a list of all previous six months and a list of all future six months.

This basically means that if i rerun the test 6 months from now "May 10" will not be available from the list. Is it possible to select the value dynamically. For example can i first calculate the current month and select the value with that is current month + 1 (i.e. next month). And also how can i build the value to be selected after i have determined what the next month is.

Any help will be greatly appreciated.

Answer 1

You can select the item based on it's position in the list (zero indexed). The following would select the third item:

<tr>
    <td>select</td>
    <td>name=arr_dtm_mon_year</td>
    <td>index=2</td>
</tr>

If you also want to know the label for the value that your selecting (or want to use it to select by label as your original code) you can use the following:

<tr>
    <td>storeText</td>
    <td>css=select[name=arr_dtm_mon_year] option:nth-child(3)</td>
    <td>label</td>
</tr>

You can then use it as follows:

<tr>
    <td>select</td>
    <td>name=arr_dtm_mon_year</td>
    <td>label=${label}</td>
</tr>

Hope that makes sense! :)

Answer 2

You could use storeEval to work out the next month (and year it the next month is January). A working example is below:

<tr>
    <td>storeEval</td>
    <td>var months = new Array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"); var now = new Date(); if (now.getMonth() == 11) { nextMonth = new Date(now.getFullYear() + 1, 0, 1); } else { nextMonth = new Date(now.getFullYear(), now.getMonth() + 1, 1); } months[nextMonth.getMonth()] + " " + nextMonth.getFullYear().toString().slice(2);</td>
    <td>label</td>
</tr>
<tr>
    <td>select</td>
    <td>name=arr_dtm_mon_year</td>
    <td>label=${label}</td>
</tr>

Be warned that this may make your tests more fragile. It's dependant on the system clock, and there may be edge cases where it doesn't work as expected.