Bug - Notification Drawer should allow focus trap
Dieses Issue hat noch niemand übernommen.
Bewertung
- Schwierigkeit
- 3/5
- Geschätzter Aufwand
- 1-2 Tage
- Anfängerfreundlichkeit
- 48/100
- Issue-Typ
- Bug
- Klarheit
- Größtenteils klar
- Aktivitätsstatus
- Ruhig
- Tech-Stack
- react, typescript
- Bereich
- accessibility, frontend
Rechercherichtung
Beginne mit der grundlegenden React-Demo für den Benachrichtigungsbereich auf der verlinkten PatternFly-Seite und überprüfe die verlinkten Beispiele zur Fokusverwaltung. Überprüfe das aktuelle Tastaturverhalten des Benachrichtigungsbereichs und stelle dann sicher, dass der Fokus beim Schließen zum Benachrichtigungs-Badge zurückkehrt und innerhalb des geöffneten Benachrichtigungsbereichs zirkuliert; validiere beide Verhaltensweisen in der Demo.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Beschreibung
Describe the problem
A clear and concise description of the problem. Which pages are affected?
When using a keyboard to navigate the page in https://www.patternfly.org/components/notification-drawer/react-demos/basic/, keyboard focus is given to the first button or link in the drawer, which is correct.
However, when a user goes and closes the notification drawer, keyboard focus does not return to the notification button, and seems to return to the browser chrome, which is disorienting.
Moreover, after tabbing to the last item in the notification drawer, the next tab press should loop back to the first item in the notification drawer; however, this is not done.
Expected behavior
A clear and concise description of the expected behavior.
In the demo, keyboard focus should be returned to the notification badge after the notification drawer is closed, and the keyboard focus should be trapped entirely within the notification drawer when it is open.
Screenshots
If applicable, add screenshots to help explain the issue.
Any other information?
See this blog post:
https://codepen.io/unleashalicia/pen/YzXrJBN
https://knowbility.org/blog/2020/accessible-slide-menus
Jira Issue: PF-1354
- Vorherrschende Sprache
- TypeScript
- Sterne
- 862
- Forks
- 392
- Ø Merge
- 4 T. 8 Std.
- Gemergte PRs (30 T.)
- 9
Beitragsleitfaden
Erste Schritte
- Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
- Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
- Forken Sie das Repository und arbeiten Sie in einem Branch.
- Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.
Mehr aus patternfly/patternfly-react
-
PF Team
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 68/100
patternfly/patternfly-react#12651 ·
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 78/100
patternfly/patternfly-react#12637 ·
-
PF Team
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 72/100
patternfly/patternfly-react#12617 · 1 Kommentar ·
-
PF Team
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 68/100
patternfly/patternfly-react#12610 · 1 Kommentar · 1 Reaktion ·
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 68/100
patternfly/patternfly-react#12600 ·
Alle Issues in patternfly/patternfly-react
Ähnliche Issues
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 84/100
bcgov/bc-wallet-mobile#4761 · 1 Kommentar ·
-
external-issue to-triage
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 88/100
-
area-deployment area-integrations triage:bot-seen
Schwierigkeit 2/5 Ein halber Tag Anfängerfreundlichkeit 86/100
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 82/100
-
refactor
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 84/100