How to choose html injected from jQuery using Selenium IDE?

Question

I am currently using the Selenium IDE to fill out a form. The form has a selection box for countries:

<select id="id_country"> <option>Canada</option> <option>England</option> </select> <select id="id_province"></select> 

The province parameters specified above are not generated until a country with provinces is selected. jQuery will take care of this generation:

 options = '<options>Alberta</options><options>Ontario</option>'; $('#id_province').html(options); 

The workflow of my Selenium workspace is as follows:

 Command Target Value select id_country label=Canada select id_province label=Ontario 

After Canada is selected, Alberta appears as the default province, but Ontario is not selected, and I get the following error in my log:

 [error] Option with label 'Ontario' not found 

Does anyone know which Selenium IDE command I should specify to correctly select the generated HTML from Javascript?

Answer 1

You probably need to pause while the thing is loading using the waitFor statement, for example.

 Command Target Value waitForSelectOptions id_province glob:*Ontario*