Tip for finding CSS & XPath locators using Chrome with an example:

Finding is one thing, making them unique is another.
In chrome inspector I like to use for

xpath: when an id is unrecognizeable and I want to derive an element from text
use In chrome console this syntax (Start with $ for css)
$x(’/div[*[contains(text(), ‘Search for text’)]]/div[2]’)

Preferably I use css
e.g.
end of ID or class ($)
use In chrome console this syntax (Start with $x for xpath)
$(’[id$=endofid]’) the end of the id name, or $(’[class$=endclass]’)
start of scr (^)
$(’[src^=“OrderReleasableServices_Popup.aspx?CustomerOrderId”]’) start of src, can be used for iframe selection as well

good luck

1 Like