aria-modal attribute (aria)
Screen reader support level: partial (5/11)
Voice Control support level: unknown
On this page
- About this feature
- Age of results
- Expectations
- Related tests
- Related AT or browser issues
- Is something not right?
About this feature
Indicates whether an element is modal when displayed. For more robust support, consider making the rest of the document inert when an element has aria-modal=true.
Age of results
Results across all tests for this feature range from 6 months ago to 6 months ago. Detailed dates and version information can be found in associated tests.
Failing and partial results are between 6 months ago and 6 months ago.
Expectations
Screen Reader support by expectation
| Expectation | JAWS | Narrator | NVDA | Orca | TalkBack | VoiceOver (iOS) | VoiceOver (macOS) | |||
|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | IE | Firefox | Edge | Chrome | Firefox | Firefox | Chrome | Safari | Safari | |
| MUST convey the presence of aria-modal=true | supported | supported | supported | none | supported | supported | partial | none | none | partial |
| SHOULD limit reading to children of aria-modal=true | supported | supported | supported | none | supported | supported | partial | none | partial | partial |
| SHOULD remove outside content from navigational shortcuts when aria-modal=true | partial | partial | partial | none | supported | supported | partial | none | none | none |
Voice Control support by expectation
| Expectation | Dragon Naturally Speaking | Voice Access (Android) | Voice Control (iOS) | Voice Control (MacOS) | Windows Speech Recognition |
|---|---|---|---|---|---|
| Chrome | Chrome | Safari | Safari | Chrome | |
| Not applicable | |||||
Expectation: convey the presence of aria-modal=true
Rationale:
Users need to be aware that other content is obscured by the modal.
Strength of this expectation for different types of assistive technologies:
- Screen Readers: MUST
- Voice Control: NA
Examples:
- Screen readers might convey the modal state when entering the modal
- Screen readers might imply the modal state by restricting reading and navigation to the modal content
| Test | JAWS | Narrator | NVDA | Orca | TalkBack | VoiceOver (iOS) | VoiceOver (macOS) | |||
|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | IE | Firefox | Edge | Chrome | Firefox | Firefox | Chrome | Safari | Safari | |
| APG modal dialog example applied to: dialog role | supported | supported | supported | none | supported | supported | partial | none | none | partial |
Expectation: limit reading to children of aria-modal=true
Rationale:
Users should not be able to access content outside of the modal. However, AT are not required to implement this functionality per the ARIA spec, and authors may implement this on their own.
Strength of this expectation for different types of assistive technologies:
- Screen Readers: SHOULD
- Voice Control: NA
| Test | JAWS | Narrator | NVDA | Orca | TalkBack | VoiceOver (iOS) | VoiceOver (macOS) | |||
|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | IE | Firefox | Edge | Chrome | Firefox | Firefox | Chrome | Safari | Safari | |
| APG modal dialog example applied to: dialog role | supported | supported | supported | none | supported | supported | partial | none | partial | partial |
Expectation: remove outside content from navigational shortcuts when aria-modal=true
Rationale:
Users should not be able to access content outside of the modal. However, AT are not required to implement this functionality per the ARIA spec, and authors may implement this on their own.
Strength of this expectation for different types of assistive technologies:
- Screen Readers: SHOULD
- Voice Control: NA
Examples:
- Screen readers must not allow allow users to jump to the next element type if that element is outside of the modal
- Screen readers must not include outside content in the list of elements
| Test | JAWS | Narrator | NVDA | Orca | TalkBack | VoiceOver (iOS) | VoiceOver (macOS) | |||
|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | IE | Firefox | Edge | Chrome | Firefox | Firefox | Chrome | Safari | Safari | |
| APG modal dialog example applied to: dialog role | partial | partial | partial | none | supported | supported | partial | none | none | none |
Expectation: convey the aria-modal attribute or limit navigation when aria-modal=false
Strength of this expectation for different types of assistive technologies:
- Screen Readers: MUST NOT
- Voice Control: NA
No tests reference this expectation yet.