Working with xpath.

WebTable are most challenging.

Partial text match:

 HTML text
<div class="ui-grid-cell-contents ng-binding ng-scope">Archana</div>

XPATH
//div[contains(text(),'Archana')]

Exact Text match

HTML text
<div class="ui-grid-cell-contents ng-binding ng-scope">Archana</div>

XPATH
//div[text()='Archana']

Navigating from child to parent

HTML text
<div ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.uid" ui-grid-one-bind-id-grid="rowRenderIndex + '-' + col.uid + '-cell'" class="ui-grid-cell ng-scope ui-grid-coluiGrid-0006" ng-class="{ 'ui-grid-row-header-cell': col.isRowHeader }" role="gridcell" ui-grid-cell="" id="1540737556446-0-uiGrid-0006-cell">

<div class="ui-grid-cell-contents ng-binding ng-scope">Archana</div>

</div>

XPATH

Orinal xpath. But shouldnt be used. As the numbers in ID might vary.
//div[text()='Archana']//ancestor::div[@id = "1540737556446-0-uiGrid-0006-cell"]


xptah to be used.

//div[text()='Archana']//ancestor::div[contains(@id,'0006')]

Navigate from FirstName to Email:

HTML Text

XPATH:
//div[text()='Archana']//ancestor::div[contains(@id,'0006')]//preceding-sibling::div[contains(@id,'0005')]//div

Here preceding-sibling has been used to refer to the div class which is above the div that we were previously referring to.


Navigate to Gender from FirstName

HTML text

XPATH

we will first refer to 1 the to 2 then 3 and finaly 4.

//div[text()='Archana']//ancestor::div[contains(@id,'0006')]//following-sibling::div[contains(@id,'0007')]//div

Conclusion:
Things to use for xpath

1) Ansestor
2) Following -sibling
3) preceding-sibling
4) Focus on xpath that is not likely to change and proceed from there onwards.
5) Use contains when the attribute is not consistant and changes with HTML dom.
6) Aboid using class. Most of the time its never constant.
7) If ID is present, use ID.