microsoft/eslint-plugin-fluentui-jsx-a11y

Accessibility Rule: Image links must have an accessible name

Closed this issue · 0 comments

Accessibility Rule: Image links must have an accessible name

See if this can be handled by jsx-eslint/eslint-plugin-jsx-a11y
configuration, if not, write a new lint rule.

You can use this repo to see if the existing rules work: https://github.com/aubreyquinn/eslint-plugin-a11y-test

Good

<a href="https://twitter.com/KittyGiraudel">
  <svg
    aria-hidden="true"
    xmlns="http://www.w3.org/2000/svg"
    viewbox="0 0 16 16"
  >
    …
  </svg>
  <span class="sr-only">Twitter</span>
</a>
<a href="https://twitter.com/KittyGiraudel">
    Twitter
</a>
<a href="https://twitter.com/KittyGiraudel" aria-label="Twitter">
  <svg
    aria-hidden="true"
    xmlns="http://www.w3.org/2000/svg"
    viewbox="0 0 16 16"
  >
    …
  </svg>
</a>

Bad - no accessible name

<a href="https://twitter.com/KittyGiraudel">
  <svg
    aria-hidden="true"
    xmlns="http://www.w3.org/2000/svg"
    viewbox="0 0 16 16"
  >
    …
  </svg>
</a>