How To Write XPath In Selenium WebDriver With Example?

Most difficult thing in Selenium is finding correct Locators, Here we are going to see how to find xpath in Selenium but before that we are going to see the division of  of object/element  Identification, Locator (xpath, css and other locators ) are divided in three category. these are as follows

1)      Location based Identification

2)      Cell based Identification

3)      Property based identification

Xpath is one example of Cell based Identification and this is further divided in four part

1)      Assess the structure of the application pages and how best to locate a label on the page:  Accessing certain structure of a web page is totally dependent on the type of application that we are using. Since we are taking webpage as the application so obliviously we will deal with HTML to  access the structure of page

Suppose the html for above page is

<Table>
<tbody>
<tr>
<td>
<span>Username</span></td>
<input id=”hfeb” type=”text”

<span>Password</span></td>
<input id=”hjhflds” type=”text”

</tbody>

<table>

From here we can see that page contains table and labels like Username and Password which is mainly present in span tag without any special property so we can track this label username and password by its text so its

Xpath would be

//span[text()=’Username’]

2)      Identify the structural relationship between a label and its associated field: Now we should deal with the relationship with Label and Field and how they are related to each other.

In our case Username and Text field comes in the same row and we are not using any cryptic and dynamic function to handle text field

3)      Construction of Xpath to identify the element that we have to use in our Selenium script: Construction of xpath is also divided in 3 parts

• Locating the label
• Using the label to find the parent row element
• Find the desired child field of the row element

The label can be located with the following XPath statement from

Step 1:

//span[text()=’Username’]

This XPath can then be modified to get to the parent row element. To do this, it is important to note that the row (TR) element is not the direct parent of the Span element. The column element represented by the td tag is the direct parent of the Span element. The tr element is the parent of the td element. Therefore, to get to the tr element, we must travel two levels up the parent hierarchy. This can be done with the following statement:

//span[text()=’Username’]/../..

Adding ‘/..’ moves the reference up one level from the SPAN element (the label) to

the SPAN element’s direct parent. Since the parent row element (TR), we now need to update the statement to get the child textbox of that row, which is represented in the HTML by the input tag. This is done by modifying the previous XPath statement to appear as follows:

//span[text()=’Username’]/../..//input

Since there is only one input element that is a child of the row element, there is no need to use any properties to further we need to go up two levels, we can do this with ‘/../..’. Once we have access to identify the input element.

4)      Using Xpath in appropriate place in script: Since we are now familiar with the xpath of

Username and password like this

driver.findElement(By.xpath(“//span[text()=’Username’]/../..//input”))

Few more work out example to learn xpath

Example 1: /AAA

This xpath says : “Select all root  AAA

<AAA> 
<BBB/>
<CCC/>
<BBB/>
<BBB/>
<DDD>
<BBB/>
</DDD>
<CCC/>
     </AAA>

Example 2: /AAA/CCC

This Xpath says : “Select all child CCC of  root AAA”

<AAA>
<BBB/>
          <CCC/>
<BBB/>
<BBB/>
<DDD>
<BBB/>
</DDD>
<CCC/>
</AAA>

Example 3: /AAA/DDD/BBB

This xpath says “Select all BBB which are children of DDD and which is further children of  root AAA”

<AAA>
<BBB/>
<CCC/>
<BBB/>
<BBB/>
<DDD>
<BBB/>
</DDD>
<CCC/>
</AAA>

Example 4:

//BBB

This xpath says “to select all BBB”

<AAA>
<BBB/>
<CCC/>
<BBB/>
<BBB/>
<DDD>
<BBB/>
</DDD>
<CCC/>
</AAA>

Example 5:

//DDD/BBB

This  Xpath says “Select all BBB which is the children of DDD

<AAA>
<BBB/>
<CCC/>
<BBB/>
<BBB/>
<DDD>
<BBB/>
</DDD>
<CCC/>
</AAA>

Example 6:

/AAA/DDD/*

This Xpath says “Select all element which are enclosed by /AAA/DDD

Example 7: //*

Select all elements in the HTML file

Example 8: /AAA/BBB[1]

This xpath says “select first Chil BBB of AAA

<AAA>

<BBB>

<BBB>

<BBB>

<BBB>

</AAA>

But to select the last BBB child of AAA

We can write

/AAA/BBB[Last()]

Example 9:

<AAA>
b1″/>
b2″/>
bbb”/>
<BBB/>
</AAA>

//@id

This xpath says: “Select all Id attribute

//BBB[@name]

This xpath says: “select all BBB with attribute “name””

bbb”/>

If we want to select all BBB in above html

Then xpath will be

//BBB[@*]

If we want to select only one BBB that don’t have any attribute in above html then

//BBB[not(@*)] 

If we want to select some specific BBB with its attributes value then

//BBB[@name=”bbb”]

Then it will select BBB where value of its attribute is bbb

Then in above HTML

bbb”/>

Friends please let me know if I am missing some concept of XPath  and in next post i will cover how xpath can be found out by using firebug along with firepath in selenium

Reference:

http://www.zvon.org/xxl/XPathTutorial/General/examples.html

http://wikipedia.org