Prioritise configurable selector types

[plumpNation]

🚀 Feature Proposal

User enters a ?regex? to suggest that they use data attributes in their markup to denote automated browser test landmarks.

When recording, this pattern is used to try to find the shortest point to a data attribute matching that pattern.

Motivation

It's considered best practice to use data attributes as element selectors since they clearly document that they are used for this purpose. Classes are often generated these days, and ids can change, move around etc. It's not explicit that the ids are used for testing. There are even schools of thought that suggest not using ids at all, especially for use as CSS selectors.

Having to edit selectors, either in the IDE or in the generated code, is time consuming, so it would be great to get that selector first time if possible.

Example

User checks "Project uses data attribute as DOM hooks for testing" Fills in text input "testid". (Data attribute therefore is data-testid.) When recording, a selector that favours the data-attribute is created, as a best effort.

Or something like that :) Thanks for the tool. It's very helpful to get people started out in browser testing.