Description

The EUI team had previously discussed adding role="dialog" and aria-modal="true" attributes to the EuiModal container, but the issue was closed around March 2023 without going forward.

I would like to revisit this and re-test our modal component with these attributes applied. Specifically I'll be testing for improved or regressed screen reader UX in announcing the modal.

Proposed solution

! https://github.com/elastic/eui/blob/5cc4ce8d232e2f0295255724727be16ea3394198/src/components/modal/modal.tsx#L90

<div
  css={cssStyles}
  className={classes}
  onKeyDown={onKeyDown}
  tabIndex={0}
  style={newStyle}
+ role="dialog"
+ aria-modal="true"
  {...rest}
>

WCAG or Vendor Guidance (optional)

• SC 4.1.2: Name, Role, Value (Level A)
• [EuiModal] Accessibilty and experience updates #3889