reactjs/react-modal

Replace focus trap with `inert`

Open

Aperta il 29 mar 2023

Vedi su GitHub
 (1 commento) (4 reazioni) (0 assegnatari)JavaScript (7294 star) (828 fork)batch import
accessibilitybrowser apicombining librariesdependenciesdiscussioneasyfeaturegood first issue

Descrizione

Now that browsers have good support for inert, could we consider replacing the custom focus trap logic with this?

Alternatively, we could use the dialog element so we get this behaviour for free.

Guida contributor

Tech stack
reactjavascript
Dominio
accessibilityfrontend
Tipo issue
feature
DifficoltàQuanto dovrebbe essere impegnativa per un nuovo contributor.
3
Tempo stimatoTempo stimato per completare e verificare uno scope piccolo.
half day
Stato attivitàQuanto è probabile che la issue sia ancora attiva e reviewable.
stale
ChiarezzaQuanto chiaramente la issue descrive problema, scope e risultato atteso.
clear
Prerequisiti
React component structurefocus trap conceptHTML inert attribute
Adatta ai principiantiQuanto la issue è adatta a contributor alla prima esperienza.
55
Direzione di ricerca
Investigate the current focus trap implementation in react modal (likely in src/modal.js or similar). Determine whether the `inert` attribute can be applied to the modal's backdrop or content. Consider the two approaches: adding `inert` to siblings or using the native `<dialog>` element. Check browser support and fallback for older browsers. Review the existing comment for maintainer feedback.