Selenium Tips: Start improving your locators

Posted by Santiago Suarez Ordoñez in Selenium Resources

Almost everyone in the Selenium testing world knows of the power of XPATH as a locating strategy, at the same way, most of them also know of its slowness on IE.

Now, if your tests have relatively simple XPATH  locators, putting some effort to change them to CSS (which has native support on all browsers) is a very good investment and will impact your tests with instant time improvements.

For this week's tip, we've decided to start addressing the basic rules for the move of simple locators from XPATH to CSS.

Direct child

A direct child in XPATH is defined by the use of a "/", while on CSS, it's defined using ">"



css=div > a

Child or subchild

If an element could be inside another or one it's childs, it's defined in XPATH using "//" and in CSS just by a whitespace



css=div a


An element's id in XPATH is defined using: "[@id='example']" and in CSS using: "#"



css=div#example a


For class, things are pretty similar in XPATH: "[@class='example']" while in CSS it's just "."



css=div.example a

Thats' all for now, as you can see, the first rules a pretty simple, and you even make you locators shorter and cleaner.

Stay tuned for our next Tip of the Week, we will keep addressing more complex locators soon!

Discuss: Selenium Tips: Start improving your locators

Free Trial

Get access to a free 14-day trial version, or contact Sales for more information.