core / makeup-screenreader-trap

Restricts the screen reader virtual cursor to a single DOM subtree. Elements hidden from screen readers are shown with strikethrough.

Default (aria-hidden)

Siblings and ancestor siblings receive aria-hidden="true"; the trapped element and its ancestors receive aria-hidden="false".

sibling before trap
sibling after trap
uncle before trap
sibling before trap
sibling after trap
uncle after trap

Pre-existing aria-hidden

Elements already marked aria-hidden before trap is activated; the original value is restored on untrap.

sibling before trap
sibling after trap

Pre-existing hidden property

Elements already using the hidden property before trap is activated; restored on untrap.

SVG siblings

Has two adjacent visible SVG text elements:

SVG sibling before trap SVG sibling after trap

Has two adjacent aria-hidden SVG text elements:

Has two adjacent hidden SVG text elements (SVG does not support the hidden property):

useHiddenProperty

Uses the hidden DOM property instead of aria-hidden to hide elements for all users.

sibling before trap
sibling after trap

Events

Events bubble from the trapped element.