Skip to content

Commit

Permalink
do not apply aria-modal in demo mode (#3227)
Browse files Browse the repository at this point in the history
When you have a `role="dialog"` and an `aria-modal="true"` at the same
time, then Safari will focus the first focusable element inside the
dialog.

This is not ideal, because in demo mode this means that the focus is
moved around to various DOM elements.

This commit ensures that the `aria-modal` is not applied when demo mode
is enabled to prevent that behavior in Safari.
  • Loading branch information
RobinMalfait authored May 22, 2024
1 parent 045f2bc commit 7fcb410
Showing 1 changed file with 1 addition and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -357,7 +357,7 @@ function DialogFn<TTag extends ElementType = typeof DEFAULT_DIALOG_TAG>(
id,
role,
tabIndex: -1,
'aria-modal': dialogState === DialogStates.Open ? true : undefined,
'aria-modal': __demoMode ? undefined : dialogState === DialogStates.Open ? true : undefined,
'aria-labelledby': state.titleId,
'aria-describedby': describedby,
}
Expand Down

0 comments on commit 7fcb410

Please sign in to comment.