Identifying HTML objects via DOM paths (Web)

Last edited on

Overview

Objects in HTML pages can also be identified using their DOM paths.

For example

DOCUMENT.HTML1.BODY1.FORM1.TABLE1.TBODY1.TR2.TD1.TABLE1.TBODY1.TR1.TD1.TABLE1.TBODY1.TR2.TD1.TABLE1

Getting an Object's DOM path

To get a DOM path for an object one of the following methods can be used.

Method 1:

Launch the application from inside Squish and make sure the relevant object is visible. Then click Squish's Application Object view's Pick toolbar button and then click the object in the application. (You may need to right-click rather than left click to avoid unintentionally activating the item or following a link.) This method is particularly useful for objects that don't normally have multi-property names (such as items in a table).

Method 2:

Obtain a reference to the object in the usual way, i.e., by calling the waitForObject() function with the object's symbolic or real (multi-property) name, and then call the hierarchicalQualifiedName() method on the object. This method returns the DOM path. For example:

# Using symbolic name:
test.log(waitForObject(names.DIV_content).hierarchicalQualifiedName())
# Using real (multi-property) name:
test.log(waitForObject({"id": "content", "tagName": "DIV"}).hierarchicalQualifiedName())

You can also use these commands in the Squish IDE's script console where they will print out the object's DOM path in the test log view: you can then copy it from there.

Method 3:

Load the page in Firefox with the Firebug plugin (or use the Firebug Lite JavaScript on your page) and use its "Copy XPath" functionality. (The string this gives you will need to be modified though.)