Test automation html element selectors. Element ID or DataAttribute [closed]

Question

I'm currently placing some ID's on elements for UI Test automation. These ID's are only being used for testing. Should I be adding data-attributes instead possibly making it more readable to future developers(data-testHandle="mybutton") or should I stick with ID's.

w3.org says:

Custom data attributes are intended to store custom data private to the page or application, for which there are no more appropriate attributes or elements.

I'm leaning towards keeping ids but some part of me thinks that future developers would think the ID's aren't used and remove them.

Any best practices here. Thanks.

Answer 1

This is close to being opinion-based, by here is the summary that should help to make a choice.

Why would you use an ID attribute:

• this is a common and familiar to everybody doing test automation way to locate elements
• this is generally the fastest way to locate elements on a page because selenium gets it down to executing document.getElementById() which is optimized by the modern browsers (though, usually performance of the end-to-end UI tests is not critical)
• it is a built-in locator in every selenium language binding
• if you would use Firebug or Chrome Developer Tools - the CSS selector and XPath generation tools would generally provide more robust locators using the ids of the element whenever possible
• you would build shorter CSS selectors and XPath expressions. E.g. #myid .someclass as opposed to [automation-id=myid] .someclass.

Why would you use a custom attribute:

• if you would add, say, automation-id attributes to all the desired elements, you would somewhat namespace/scope it to the test automation - everybody would know what is this for just from the attribute name. Meaning, you would dramatically decrease chances of a developer changing the attribute intentionally as opposed to an id attribute, which can and is usually used for application client-side logic as well (reference to this and this answer)

---

Also, here are some relevant threads:

• Is adding IDs to everything standard practice when using Selenium?
• Which is the best and fastest way to find the element using webdriver? By.XPath or By.ID or anything else? And why?
• Something Better than IDs for Identifying Elements in Selenium Tests