Dialog accessibility · Needless UI

Keyboard interaction

Key	Action
`Tab`	Moves focus to the next element inside the dialog.
`Shift + Tab`	Moves focus to the previous element inside the dialog.
`Escape`	Closes the dialog, unless it isn’t dismissible.

Opening with showModal() gives the dialog role="dialog" and modal semantics, and makes the rest of the page inert.
The title and description are linked by generated ids, so screen readers announce both when the dialog opens.
Initial focus goes to the element with autofocus, or to the first focusable element. For destructive confirmations, put autofocus on the safe choice.
When the dialog closes, focus returns to the element that opened it.
Browsers may still close a non-dismissible dialog after repeated Escape presses without user interaction, so always offer an explicit way out.