checkly / headless-recorder

Chrome extension that records your browser interactions and generates a Playwright or Puppeteer script.
https://checklyhq.com/headless-recorder
MIT License
15.03k stars 722 forks source link

Default to text selectors for Playwright #167

Closed RyKilleen closed 1 year ago

RyKilleen commented 3 years ago

Is it technically feasible to default to something like button:has-text("Log In") instead of incredibly long, unmaintainable selectors? Some way of defaulting to the shortest text-based selector when possible? I'd love to be able to use this extension while also following Playwright's best practices of using text in all possible cases.

ianaya89 commented 3 years ago

@RyKilleen did you try (or is possible for you) to use a data attribute? You can set something like data-testid to your HTML elements and then configure the extension to use it in the options page. Once is enabled, data attributes will take precedence over other selectors.

dolfje commented 2 years ago

With pull request https://github.com/checkly/headless-recorder/pull/178 it is possible to set a custom resolver. In the pull request, you can also find code that you have to set as custom resolver

ianaya89 commented 1 year ago

https://github.com/checkly/headless-recorder/issues/232