grafana/packages/grafana-eslint-rules
Josh Hunt 959c89793f
Chore: eslint rule for preventing e2e selectors in aria-label (#59731)
* Create eslint plugin/rule for catching e2e selectors in aria-label

* Add no-aria-label-e2e-selectors to betterer

* chore: skip levitate for the `grafana-eslint-rules` package

* Fix rule

* Add readme

* Add Apache 2 license

* Typecheck using @typescript-eslint/utils

* actually export the rule

Co-authored-by: Levente Balogh <balogh.levente.hu@gmail.com>
2023-01-18 15:02:35 +00:00
..
rules Chore: eslint rule for preventing e2e selectors in aria-label (#59731) 2023-01-18 15:02:35 +00:00
index.cjs Chore: eslint rule for preventing e2e selectors in aria-label (#59731) 2023-01-18 15:02:35 +00:00
LICENSE_APACHE2 Chore: eslint rule for preventing e2e selectors in aria-label (#59731) 2023-01-18 15:02:35 +00:00
package.json Chore: eslint rule for preventing e2e selectors in aria-label (#59731) 2023-01-18 15:02:35 +00:00
README.md Chore: eslint rule for preventing e2e selectors in aria-label (#59731) 2023-01-18 15:02:35 +00:00

Grafana ESLint Rules

This package contains custom eslint rules for use within the Grafana codebase only. They're extremley specific to our codebase, and are of little use to anyone else. They're not published to NPM, and are consumed through the Yarn workspace.

Rules

@grafana/no-aria-label-selectors

Require aria-label JSX properties to not include selectors from the @grafana/e2e-selectors package.

Previously we hijacked the aria-label property to use as E2E selectors as an attempt to "improve accessibility" while making this easier for testing. However, this lead to many elements having poor, verbose, and unnecessary labels.

Now, we prefer using data-testid for E2E selectors.