Selenium IDE HTML Compare Pattern

I was needing to test sorting for a web-based application UI this last week. What I needed to do was check that a listbox control’s account numbers were sorted in ascending order. What quickly emerged was a pattern of steps when using Selenium IDE HTML scripts to compare values.

First, get the string values to compare. Then, compare the values. You may need to parse the value as a float via the JavaScript parseFloat() function if working with decimals such as currency. If you use the eval() function (see below), you are good on comparing numbers such as integers. Finally, verify the expected outcome of the comparison.

As stated above the first thing is to get the values to compare:

<!-- get the first account number in the listcontrol -->
<tr>
            <td>storeEval</td>
            <td>var Account1 = ""; var
accountOptionList =
selenium.browserbot.getCurrentWindow().document.getElementsByName('accountList');Account1
= accountOptionList.item(0)[1].value</td>
            <td>Account1</td>
</tr>

<!-- get the second account number in the listcontrol -->
<tr>
            <td>storeEval</td>
            <td>var Account2 = ""; var
accountOptionList =
selenium.browserbot.getCurrentWindow().document.getElementsByName('accountList');Account1
= accountOptionList.item(0)[2].value</td>
            <td>Account2</td>
</tr>

Next, compare the values and place the comparison value into a variable:

<tr>
            <td>storeEval</td>
            <td>var isLess = false; isLess =
eval(${Account1} &lt; ${ Account2});</td>
            <td>isLess</td>
</tr>

Finally, verify that the comparison value evaluated as expected (that
the first numeric value is less than the second if sorted correctly):

<tr>
            <td>verifyExpression</td>
            <td>${isLess}</td>
            <td>true</td>
</tr>