XPath for elements using Chrome?

Question

Is there a way to get XPath of UI elements using Chrome Developer Tools (DevTools) ? I want to use the XPath in Selenium UI auto-testing.

Answer 1

How to get an XPath to an element in Chrome

1. Right-click on the UI element and select "Inspect."
2. A tree structure representation of the elements is shown.
3. Right-click on any element and select "Copy > Copy XPath."
4. Your clipboard will then have the XPath to the selected element. Paste it where you need it.

Realize that you may need to adjust manually to make more precise, more general, or more robust, depending upon the particulars of the element and what's on the rest of the page.

Answer 2

1. Place the cursor on the element

2. Perform right click and click on Inspect. You will see your elements getting highlighted

3. On the highlighted element under the Elements Tab of the console, right click and Copy xpath like in the image below: