Wednesday, December 11, 2013

How to get XPATH for any Object in IE?

Are you stuck with an application that only works in IE? 

Do you want the XPATH of an element that can be seen only IE? Unable to replicate the scenario in Firefox. There are many Firefox add-ons like xpather, xpath-checker and firebug that will give you the xpath of an element in a second. But sadly there is no add-on or tool available that will do this for IE. For most cases you can get the xpath of the elements that fall in your script using the above tools in Firefox and tweak them a little (if required) to make them work in IE. But if you are testing an application that will work only in IE or the specific scenario or page that has this element will open-up/play-out only in IE then you cannot use any of the above mentioned tools to find the XPATH.

Well the only thing that works in this case is the “Bookmarklets” that were coded just for this purpose. Bookmarklets are JavaScript code that you will add in IE as bookmarks and later use to get the XPATH of the element you desire. Using these you can get the XPATH as easily as you get using xpather or any other Firefox add-on.

STEPS TO INSTAL BOOKMARKLETS:

1. Open IE

2. Type about:blank in the address bar and hit enter

3. From Favorites main menu select--->Add favorites

4. In the Add a favorite popup window enter name GetXPATH1.

5. Click add button in the add a favorite popup window.

6. Open the Favorites menu and right click the newly added favorite and select properties option.

7. GetXPATH1 Properties will open up. Select the web Document Tab.

8. Enter the following in the URL field.
javascript:function getNode(node){var nodeExpr=node.tagName;if(!nodeExpr)return null;if(node.id!=''){nodeExpr+="[@id='"+node.id+"']";return "/"+nodeExpr;}var rank=1;var ps=node.previousSibling;while(ps){if(ps.tagName==node.tagName){rank++;}ps=ps.previousSibling;}if(rank>1){nodeExpr+='['+rank+']';}else{var ns=node.nextSibling;while(ns){if(ns.tagName==node.tagName){nodeExpr+='[1]';break;}ns=ns.nextSibling;}}return nodeExpr;}

9. Click Ok. Click YES on the popup alert.

10. Add another favorite by following steps 3 to 5, Name this favorite GetXPATH2 (step4)

11. Repeat steps 6 and 7 for GetXPATH2 that you just created.

12. Enter the following in the URL field for GetXPATH2
javascript:function o__o(){var currentNode=document.selection.createRange().parentElement();var path=[];while(currentNode){var pe=getNode(currentNode);if(pe){path.push(pe);if(pe.indexOf('@id')!=-1)break;}currentNode=currentNode.parentNode;}var xpath="/"+path.reverse().join('/');clipboardData.setData("Text", xpath);}o__o();

13. Repeat Step 9.

You are all done!!

Now to get the XPATH of elements just select the element with your mouse. This would involve clicking the left mouse button just before the element (link, button, image, checkbox, text etc) begins and dragging it till the element ends. Once you do this first select the favorite GetXPATH1 from the favorites menu and then select the second favorite GetXPATH2. At his point you will get a confirmation, hit allow access button. Now open up a notepad file, right click and select paste option. This will give you the XPATH of the element you seek.