palantir/blueprint

Background elements of Dialog/Drawer should be unfocus-able and hidden. Headers in background should not show up in screenreader heaver navigation

Open

#6 756 ouverte le 4 avr. 2024

Voir sur GitHub
 (0 commentaires) (0 réactions) (0 assignés)TypeScript (20 263 stars) (2 167 forks)batch import
Domain: accessibilityStatus: needs proposalType: bughelp wanted

Description

Environment

  • Package version(s): 5.8.2
  • Browser and OS versions: Edge, Chrome, MacOS Sonoma 14.4

Feature request

When a Dialog or Drawer is open, the background elements should be un-focusable and hidden. This is backed up by this source and this source. Otherwise, the screenreader cursor could focus on something behind the Dialog/Drawer.

Examples

Currently when navigating by headings (CTRL+OPT+U on Mac) using a screenreader, currently when a Dialog or Drawer is open, the headers in the content underneath the overlay are also included in header navigation, which is unexpected.

Guide contributeur

Stack technique
typescriptreacthtmlcss
Domaine
frontendaccessibility
Type d'issue
feature
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
3
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
half day
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
fresh
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
clear
Prérequis
ReactARIAfocus managementBlueprint components
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
65
Direction de recherche
Investigate the Dialog and Drawer components in the Blueprint source code (likely under packages/core/src/components/dialog/ and drawer/). Determine how to apply `aria hidden="true"` to the root container or sibling elements when a dialog is open, and ensure focus trapping is implemented correctly. Refer to the WAI ARIA pattern for modal dialogs linked in the issue. No linked PRs or comments are available yet.