Accessibility: Focusable div at beginning of modals
Dieses Issue hat noch niemand übernommen.
Bewertung
- Schwierigkeit
- 3/5
- Geschätzter Aufwand
- 1-2 Tage
- Anfängerfreundlichkeit
- 35/100
- Issue-Typ
- Bug
- Klarheit
- Größtenteils klar
- Aktivitätsstatus
- Veraltet
- Tech-Stack
- react, typescript
- Bereich
- accessibility, frontend
Rechercherichtung
Beginne mit der verknüpften CodeSandbox-Reproduktion und untersuche die Fokusbehandlung des Dialogs nach dem Öffnen. Verwende Tab, um nachzubilden, dass der Fokus zum ausgeblendeten div nach der OK-Schaltfläche wechselt. Fertig ist es, wenn der Fokus sichtbar bleibt und zwischen den interaktiven Elementen innerhalb des Modals zirkuliert.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Beschreibung
Reproduction link
Steps to reproduce
- Open modal
- Use keyboard Tab key to move focus
- Note that focus is "lost" (become invisible) after moving past the OK button, due to focus moving to the hidden div at the top of the modal
What is expected?
Focus should stay within the modal, moving between interactive elements, and should not disappear at any point
What is actually happening?
Focus visually disappears when landing on the non-interactive and invisible hidden
at the top of the modal Environment | Info -- | -- antd | 5.17.0 React | 17 System | Mac Sonoma 14.4.1 (23E224) Browser | Version 124.0.6367.158 (Official Build) (arm64)This is technically a failure of the Focus Visible and Focus Order WCAG guidelines:
Focus Visible: https://www.w3.org/WAI/WCAG21/Understanding/focus-visible.html
Focus Order: https://www.w3.org/WAI/WCAG21/Understanding/focus-order.html
- Vorherrschende Sprache
- TypeScript
- Sterne
- 454
- Forks
- 207
- PR-Merge-Kennzahlen
- Keine gemergten PRs in 30 T.
Entwicklungsumgebung
Dieses Projekt bietet weder Dev-Container noch Dockerfile noch Beitragsleitfaden – die Einrichtung liegt bei Ihnen. Beginnen Sie mit der README; die allgemeinen Schritte stehen in unserem Leitfaden für den ersten Beitrag.
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 react-component/dialog
-
Schwierigkeit 3/5 1-2 Tage Anfängerfreundlichkeit 38/100
react-component/dialog#467 · 1 Reaktion ·
-
为什么dialog没有淡入淡出的动画呀Offen
Schwierigkeit 3/5 1-2 Tage Anfängerfreundlichkeit 25/100
react-component/dialog#450 ·
-
有没有安卓版啊Offen
Schwierigkeit 5/5 Über eine Woche Anfängerfreundlichkeit 15/100
react-component/dialog#407 ·
-
Schwierigkeit 3/5 1-2 Tage Anfängerfreundlichkeit 45/100
react-component/dialog#382 · 3 Kommentare ·
-
Schwierigkeit 3/5 1-2 Tage Anfängerfreundlichkeit 45/100
react-component/dialog#342 ·
Alle Issues in react-component/dialog
Ähnliche Issues
-
twilio.webhook() rejects valid requests when the query string has an encoded `?` and a `+` spaceOffen
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 75/100
twilio/twilio-node#1232 ·
Maintainer antworten meist innerhalb von 1 Tag
-
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 86/100
Maintainer antworten meist innerhalb von 1 Tag
-
Tiling managers are not destroyed in disable(), so window-created handlers keep running (Gio.Settings constructed without schema)Evtl. vergeben @gnacho hat das heute übernommen. Offen
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 72/100
domferr/tilingshell#641 ·
Maintainer antworten meist innerhalb von 3 Tagen
-
🐛 bug
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 78/100
LibreChat-AI/LibreChat#17887 ·
Maintainer antworten meist innerhalb von 1 Tag
-
`isCI` is `true` inside a running Google Cloud Run service (also Railway, Render, Deno Deploy)Offen
Schwierigkeit 2/5 1-3 Stunden Anfängerfreundlichkeit 86/100