7. Primer on Dynamic X-Path creation

Introduction to Dynamic X-Paths

What is an object repository?

If you have prior experience using QTP or UFT, you might know about the test object repository. The object repository is a collection of objects on the webpage under consideration. In a page object model framework, we embed the object repository in the page object classes. For a framework to be stable, we should always use customized x-path rather than absolute x-path because if the x-path of any html element changes, then the framework is destined to break.

(For those who are new to XPath - XPath is defined as XML path. It is a syntax or language for finding any element on the web page using XML path expression. XPath is used to find the location of any element on a webpage using HTML DOM structure)

There are various type of dynamic x-path which use various tags. Let's look at each:

1) Using single attribute

2) Using multiple attributes

3) Using contains

4) Using starts-with

5) Using Following node

6) Using Preceding node

We will be using automationpractice.com as an example website for building our framework. We will create the actual dynamic x-paths when we create the page objects. But for now, we will explore all the different ways in which we can create dynamic x-paths.

1) Using single attribute

// tagname[@attribute-name=’value1’]

tagname can be a,input, select etc.

Example

// a [@href=’http://www.google.com’]

//input[@id=’sampleid’]

//input[@name=’sample1’]

//img[@alt=’text1’]

2) Using multiple attributes

// tagname[@attribute-name1=’value1’] [@attribute-name1=’value1’]

//label[@name=’samplename’][text()='User'] (Notice that text() does not require the @ symbol)

3) Using contains

//*[contains(attribute1,value1)]

Eg.

//*[contains(text(),'User')]

//* will find a particular element in the entire DOM[Document Object Model]. You can reduce the search criteria by specifying a particular tagname rather than the entire DOM.

Eg. //label[contains(text(),'User')]

4) Using starts-with

//tagname[starts-with(@attribute-name,’’)]

eg.

//id[starts-with(@id,’’)]

//a[starts-with(@href=’’)]

//img[starts-with(@src=’’)]

//div[starts-with(@id=’’)]

//input[starts-with(@id=’’)]

//button[starts-with(@id,’’)]

And so on.

5) Using Following node

Xpath/following::the-regular-path

eg.

//input[@id=’’]/following::input[1]

//a[@href=’’]/following::a[1]

//img[@src=’’]/following::img[1]

6) Using Preceding node

Xpath/preceding::the-regular-path

//input[@id=’’]/ preceding::input[1]

//a[@href=’’]/ preceding::a[1]

//img[@src=’’]/ preceding::img[1]

These are enough to work with now. We will cover more as and when needed. The advantage of xpath over css is we can traverse in either direction. css is able to traverse only in the forward direction. The advantage of css over xpath is that retrieval using css is faster than xpath