search

NuGet / NuGetGallery

NuGet Gallery is a package repository that powers https://www.nuget.org. Use this repo for reporting NuGet.org issues.
https://www.nuget.org/
Apache License 2.0
1.52k stars 643 forks source link

Solve Package Page Tooltip Accessibility Bugs and Framework Filter Checkbox List Accessibility Bug #9929

Closed Goodyear2017 closed 2 months ago

Goodyear2017 commented 2 months ago

Accessibility issues on production:

  1. Narrator is unable to read the toolstrip when hover or use tab key to activate "Framework" tooltip.
  2. When tab on package badge, screen reader reads the aria label content but without tooltip display
  3. When any of the "Framework filter mode" checkbox selected and dropdown open, user unable to use up and down arrow key to move the selection. Solution: Disable Bootstrap popover JavaScript on framework filter and support framework badges, keep the popover classes and layout, add JavaScript function to make the tooltip popup, narrator can read the tooltip.

Add up and down arrow key JavaScript function to make users are able to use arrow keys to move between framework filter mode checkboxes. Bug links:

https://devdiv.visualstudio.com/DevDiv/_queries/edit/?tempQueryId=91c293b3-665c-4cb3-876f-e7e4c119b7d1&id=1970893 https://devdiv.visualstudio.com/DevDiv/_queries/edit/?tempQueryId=91c293b3-665c-4cb3-876f-e7e4c119b7d1&id=1970906 Screenshots and video image [before.webm](https://github.com/NuGet/NuGetGallery/assets/34078976/7fd13ec5-6243-41a2-91f0-76cf3de79302) [after.webm](https://github.com/NuGet/NuGetGallery/assets/34078976/085aed7b-0686-46b1-8720-4e710e74d6c2)