Selenium: In a dynamic table, locate a row and click a radio button or checkbox or link

Friday, September 4, 2009

Let's say, you have a table which has rows getting added dynamically and you would like to select that particular row and do some action. Assuming there is one column which is unique

Have firebug and XPath checker handy. (firefox addons)

Let's say, the foll. is your source of the table (firebug)

<form id="batch-action-form" action="" method="post">

<div class="actions">

</div>

<table cellspacing="0">

<thead>

</thead>

<tbody>

<tr class="row1">

</tr>

<tr class="row2">

<td>

<input class="batch-select" type="checkbox" name="selected" value="13"/>

</td>

<th>

<a href="13/">observation</a>

</th>

<td>

<h2>This is a test</h2>

<img alt="This is a test" src="/media/test/photologue/photos/cache/test__thumbnail.jpg"/>

</td>

<td>Approved</td>

</tr>

<tr class="row1">

</tr>

<tr class="row2">

<td>

<input class="batch-select" type="checkbox" name="selected" value="14"/>

</td>

<th>

<a href="14/">observation</a>

</th>

<td>

<h2>This is not a test</h2>

<img alt="This is not a test" src="/media/test/photologue/photos/cache/nottest__thumbnail.jpg"/>

</td>

<td>Rejected</td>

</tr>

<tr class="row1">

</tr>

<tr class="row2">

<td>

<input class="batch-select" type="checkbox" name="selected" value="15"/>

</td>

<th>

<a href="15/">observation</a>

</th>

<td>

<h2>This may be a test</h2>

<img alt="This may be a test" src="/media/test/photologue/photos/cache/maybetest__thumbnail.jpg"/>

</td>

<td>Unmoderated</td>

</tr>

</tbody>

</table>

</form>

To click on the checkbox of the row which has "This is a test", the xpath would be

//form[@id='batch-action-form']/table/tbody/tr/td/h2[contains(text(),'This is a test')]/../../td/input[@type='checkbox']

1. Download Firefox and it's addons firebug and xpath checker

2. Goto the page which has the table.

3. open the firebug and inspect the element

4. right click on the element and click View XPath

5. then play around with the xpath until you see the desired field shows up.

6. cut and paste that to the selenium script

7. for the above example: check | //form[@id='batch-action-form']/table/tbody/tr/td/h2[contains(text(),'This is a test')]/../../td/input[@type='checkbox']

That would check the appropriate checkbox for the row which has the text "This is a test"