XPath and WATiR

WATiR provides very simple API's for functional testing an Web Application. With even limited scripting experience with Ruby you'll be able to create scripts to test your application. It provides API's for accessing almost all common elements on an HTML page. It allows you to access elements on the basis of some pre-defined attributes.

Now, there were few things that were lacking:
1. What if you have a element which you can't access using those pre-defined attributes?
2. What if there is no API for a particular HTML element?
3. What if you want to access some element depeding upon some other element? For e.g.: Accessing which has a image with some pre-defined "src" attribute.

The solution to all above problems is using XPATH to access these elements. XPATH query is a well defined and very powerful way for addressing elements in an XML document. If the HTML markup of the page is well-formed we can treat it as XML document and use XPATH query to select an element. So we introduced a new attribute to address such elements called ":xpath".

Will explain the usage of XPATH with examples for each of the above problem.

Problem1: Accessing elements using attributes that are not pre-defined:


Suppose you have an HTML "select" element like:

<select foo="bar"> <option value="1">1< /option> < /select>


Now "foo" is not standard attribute but browser will simply ignore it. Now if you want to access this element you need to use XPATH query. So to access element the statement will look like:

element = browser.select(:xpath, "//select[@foo='bar']")

The above statement will return you the desired element.

Problem2: Accessing elements for which there is no class in WATiR:

Suppose you have an HTML "map" element on your page. Now for "map" element there is no class in WATiR which you can use to access the elements. For such elements you can use the function "element_by_xpath" which takes in "XPATH query" and return you the desired element.

Example:

Suppose you have a "map" like this:

< map name="top_menu_map" id="top_menu_map">
< area shape="rect" coords="18,2,62,17" ref="http://engin.com.au/public/index.htm" target="_self" alt="engin home"> < /area >
< /map>

Now you want to access "area" element. You can do it using the function described above. So to access element the statement will look like:

browser.element_by_xpath("//area[contains(@href , 'signup.htm')]").click()

Problem3: Accessing elements with respect to other elements:

Suppose you need to access an element(which doesn't have any fix attribute) based on position of some other element(which has a fix attribute). WATiR doesn't provide any direct way to access element based on position of other element. So what you can do is:
1. Go to the element which is fixed using WATiR classes. Then, traverse the DOM tree using the underlying "ole_object" for that element.
OR
2. Supply an XPATH query that selects the element based on the position of other element.


Example:

Suppose you have an HTML like this:


<table>
<tr>
<td> <img src="1.jpg"> <input type="button"> < /td>
<td> <img src="2.jpg"> <input type="button"> < /td>
<td> <img src="3.jpg"> <input type="button"> < /td>
<td> <img src="4.jpg"> <input type="button"> < /td>
< /tr>
<tr>
<td> <img src="5.jpg"> <input type="button"> < /td>
<td> <img src="6.jpg"> <input type="button"> < /td>
<td> <img src="7.jpg"> <input type="button"> < /td>
<td> <img src="8.jpg"> <input type="button"> < /td>
< /tr>
< /table>

Now suppose you want to click on button that has image with src="7.jpg" in front of it. So you have two ways to do it:
1. First find out the table using :index attribute which is always dangerous because page structure may change. Then iterate over rows and then cells to find which cell contains that image. Then in that cell find the button and then click it.
OR
2. You can give an "XPATH " query to select the element. So your statement will look like this:

browser.button(:xpath, "//img[@src='7.jpg']/input").click()

Problems with XPATH:
The only problem with XPATH is that its a bit slower while selecting the elements on the page. We are working on improving the time it takes to select the element.

So to summarize, using XPATH query you get extreme powerful selection mechanism which will allow you select those elements also that are other wise difficult to select using WATiR native selection mechanism.