Skip to content

Add eslint-plugin-jsx-a11y and fix common accessibility issues

Administrator requested to merge tr/fix-a11y-lint-issues into main

Created by: umpox

This PR

  • Fixes issues that are raised by adding eslint-plugin-jsx-a11y.
  • Makes some minor styling / logic changes to ensure changes maintain current UX where desired
  • eslint-ignores some areas where it is either a) not feasible to fix the accessibility issue as part of this PR or b) doesn't make sense to change in this particular context.

This PR assumes we are using the recommended setup from eslint-plugin-jsx-a11y with some modifications:

  • Disables accessible-emoji. The rule is now deprecated as browsers support emojis better for screenreaders.
  • Disables no-autofocus. The reasoning for this rule is primarily for pages where autofocus is used to immediately steal focus without giving the user much context (e.g. on page load). We're using autofocus a lot to declaratively capture focus at specific component render time, I don't see any specific issues with this approach assuming we give users additional context.
  • Disables no-onchange. This rule is also deprecated as browsers have better behaviour for <select> elements.

Unblocks https://github.com/sourcegraph/eslint-config/pull/170 FIxes https://github.com/sourcegraph/sourcegraph/issues/18866

Merge request reports