Element Locator Strategy - Introduction

This is the first blog post in a series on locator strategies.

Locators are very important when doing test automation. Identifying proper locators is one of the most important steps when writing tests and contributes to the building of efficient scripts. It helps to ensure that tests are maintainable, reliable and is less flaky overtime.

What are web elements?

Elements on a webpage are created using HTML(Hyper Text Markup Language). Standard markup language for creating Web pages and describes the structure of a Web page using a series of elements that tell the browser how to display content. An HTML element is defined by a start tag, some content, and an end tag:

<tagname> Element Content </tagname>

<h1> HTML Element Tutorial </h1>
<button> Click Here </button>

There is a diverse range of web elements. For Example:

• Text box
• Button
• Drop Down
• Hyperlink
• Check Box
• Radio Button

Element Locator

An element locator is different from an element. An element is rendered on a webpage while an element locator is an address that uniquely identifies a web element within a webpage. An element locator is also referred to as selector/identifier and finds and returns specific elements and can be found using different strategies.

Locators are used by our tests to perform specific actions on a web page such as clicking on a link or button, getting the text of a header or entering some value into an input field.

Locator Strategies

There are several different locator strategies that can be used to find elements such as:

• ID
• Name
• Class Names
• CSS
• XPATH

We will be going through each of these locator strategies in this series.

Proper Locator Strategy

It is very important that we follow proper locator strategy when doing test automation as the application can and will change, and test automation needs to be maintained to test those changes.

It is advised that you use the element selector that is most unlikely to change to make the automation as robust as possible. That principle has not changed. The specific order has. Back in 2020, when this series started, the order I reached for was:

• Unique id
• Unique class
• Unique attributes

Since then, the most stable thing on a modern web app has turned out to be an element’s role and accessible name, not a generated id, so that is where I start now. Part 5 walks through the full, updated priority order, and that is the one to use today. Treat the list above as the starting point this series grew out of, not the finished answer.

It is also very important that developers when creating web elements follow this as it will greatly improve how friendly an application is for test automation resulting in more reliable and maintainable tests.

The rest of the series

Each strategy gets its own walkthrough, with real examples and the traps to watch for:

• Part 2: ID, Name, and Class (and When Each One Breaks)
• Part 3: CSS Selectors That Survive a Redesign
• Part 4: XPath, and When You Actually Need It
• Part 5: Choosing the Right Locator, a Priority Order for 2026
• Part 6 (advanced): The Hard Cases, When a Correct Selector Still Fails

Part 5 is the one to start from if you only read one, since it carries the updated priority order. If you want a quick reference to keep open while you write, there is also an element locator cheat sheet with copy-ready selectors and a practice playground.

Check out the Youtube Tutorial for this blog.