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

Give precedence to data-* and trust in ID's uniqueness #130

Closed ianaya89 closed 3 years ago

ianaya89 commented 3 years ago

Give precedence to `data-*` and trust in ID's uniqueness

Description

Introducing small improvements in selectors logic:

When data-* is set, it will take precedence from over any other selector
If target selector is based on data-* (and it was set) or id, will generate a shorter output based only on those attributes (data-* or id)

Add a label to settings page in order to inform users about this behaviour

Screen Shot 2021-01-18 at 23 37 13

Fix https://github.com/checkly/headless-recorder/issues/60

Type of change

Please delete options that are not relevant.

[x] Bug fix (non-breaking change which fixes an issue)
[x] New feature (non-breaking change which adds functionality)
[ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
[ ] This change requires a documentation update

How Has This Been Tested?

New tests cases were created in attributes.spec.js

Checks that data-* will be used even if id is present
Checks that a target based on id selector will generate a shorter output based only on id

Checklist:

[x] My code follows the style guidelines of this project. npm run lint passes with no errors.
[x] I have made corresponding changes to the documentation
[x] I have added tests that prove my fix is effective or that my feature works
[x] New and existing unit tests pass locally with my changes. npm run test passes with no errors.

tnolet commented 3 years ago

@ianaya89 I think @maxigimenez is better at reviewing this...I get lost here quite quickly.