Skip to content

[SG-35212] Wildcard <Icon /> accessibility: `client/web/src/repo`, `site-admin`, `user`

Warren Gifford requested to merge contractors/SG-35212 into main

Created by: gitstart-sourcegraph

closes https://github.com/sourcegraph/sourcegraph/issues/35256 closes https://github.com/sourcegraph/sourcegraph/issues/34974 closes https://github.com/sourcegraph/sourcegraph/issues/35258

Description

Our Icon component is not currently accessible and will cause issues across our application. Screen readers will report each icon as "unlabelled image" - which isn't helpful to anyone.

Migrate the rest of the codebase to use either title or aria-hidden="true"

Expected behavior

For decorative icons, we should set aria-hidden="true". This will ensure screen readers completely ignore the icon, as it adds no value to the user journey.

For icons that add useful information to the page, we should set role="img" and title="Some descriptive text". This will ensure screen readers are able to properly understand to meaning of the icon.

Ref

SG Issue Gitstart Ticket

Implementation Detail

Note: role="img" to <Icon /> would be added on following client/web/src directories:

  • repo
  • site-admin
  • user

And fix all the accessibility audit errors

Test Plan

Run integration tests to ensure that there are no unresolved accessibility issues reported

Affected areas

  1. client/web/src/repoi
  2. client/web/src/site-admin
  3. client/web/src/user

App preview:

Check out the client app preview documentation to learn more.

Merge request reports