javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-18 19:21:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(overlays): focus trapping no longer includes hidden elements (#25948)

Browse Source
This commit is contained in:
Liam DeBeasi
2022-09-15 15:36:45 -05:00
committed by GitHub
parent 8629dfa9e8
commit 5c10f98ceb
2 changed files with 38 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
core/src/utils/overlays.ts
View File

@ -82,8 +82,16 @@ export const createOverlay = <T extends HTMLIonOverlayElement>(
return Promise.resolve() as any;
};
/**
* This query string selects elements that
* are eligible to receive focus. We select
* interactive elements that meet the following
* criteria:
* 1. Element does not have a negative tabindex
* 2. Element does not have [hidden]
*/
const focusableQueryString =
'[tabindex]:not([tabindex^="-"]), input:not([type=hidden]):not([tabindex^="-"]), textarea:not([tabindex^="-"]), button:not([tabindex^="-"]), select:not([tabindex^="-"]), .ion-focusable:not([tabindex^="-"])';
'[tabindex]:not([tabindex^="-"]):not([hidden]), input:not([type=hidden]):not([tabindex^="-"]):not([hidden]), textarea:not([tabindex^="-"]):not([hidden]), button:not([tabindex^="-"]):not([hidden]), select:not([tabindex^="-"]):not([hidden]), .ion-focusable:not([tabindex^="-"]):not([hidden])';
export const focusFirstDescendant = (ref: Element, overlay: HTMLIonOverlayElement) => {
let firstInput = ref.querySelector(focusableQueryString) as HTMLElement | null;