Useful XPATH patterns for selenium IDE

Useful XPATH patterns

starts-with

Many sites use dynamic values for element’s id attributes, which can make them difficult to locate. One simple solution is to use XPath functions and base the location on what you do know about the element. For example, if your dynamic ids have the format <input id="text-12345" /> where 12345 is a dynamic number you could use the following XPath://input[starts-with(@id, 'text-')]

contains

If an element can be located by a value that could be surrounded by other text, the contains function can be used. To demonstrate, the element <span class="top headingbold"> can be located based on the ‘heading’ class without having to couple it with the ‘top’ and ‘bold’ classes using the following XPath: //span[contains(@class, 'heading')]. Incidentally, this would be much neater (and probably faster) using the CSS locator strategycss=span.heading

siblings

Not yet written - locate elements based on their siblings. Useful for forms and tables.

Starting to use CSS instead of XPATH

Locating elements based on class

In order to locate an element based on associated class in XPath you must consider that the element could have multiple classes and defined in any order. However with CSS locators this is much simpler (and faster).

• XPath: //div[contains(@class, 'article-heading')]
• CSS: css=div.article-heading

 How to write XPATH for an element for Selenium IDE

.The purpose of it in Selenium  is to locate an element which can be used while writing a script in Selenium IDE.The XPATH when written in Selenium is helpful in locating the element without fail.

Importance of XPATH in Selenium IDE

XPATH is useful in identifying and locating the page elements with it's html information.Each and every html tag has  XPATH for it.It can be written for each and every html tag.When writing it you will be using the html tags for reference.To get the XPATH of  an element you should install the Firebug in your Mozilla Firefox browser.It helps in identifying the XPATH by using the HTML tags.As Selenium IDE runs on Mozilla Firefox browser the Firebug is the tool which should be added to your browser to make your work easier while writing XPATH.

How to write XPATH for Selenium IDE ?

It  is written with the tags of the elements.

You can get the basic XPATH of an element by using the Firebug which you have added to the Mozilla Firefox browser as an Add-On. To get an XPATH of an element right click on the element and select "Inspect element with Firebug". And when you happen to visit the element in the Firebug right click on it and select copy XPATH. By this method you can copy the XPATH and paste it in your Selenium IDE tool's Target section.

How does the basic XPATH look like?

/html/body/div[2]/div/div/div/div/div/div/div/h1/span

Is there any other method by which the XPATH looks simple?

The way to write the XPATH for Selenium is as follows

//element[@attribute="attribute value"]

Here are the examples for you.

<div id="y-cols" class="clearfix y-fp-ln-pg">

//div[@id="y-cols" @class="clearfix y-fp-ln-pg"]

<span class="logo">Yahoo! India</span>

//span[@class="logo"]

<img id="p_13872472-header-image" class="" src="http://l1.yimg.com/t/images/paes-and-bhupathi-392-160612.jpg">

//img[@id="p_13872472-header-image" and @class=""]

<input id="p_13838465-p" class="input-query input-long med-large">

//input[@id="p_13838465-p" and @class="input-query input-long med-large"]

<button id="search-submit" class="searchsubmit med-large y-fp-pg-grad">search</button>

//button[@id="search-submit"  @class="searchsubmit med-large y-fp-pg-grad"]

In this  same manner you can write XPATH for all the elements