material-web icon indicating copy to clipboard operation
material-web copied to clipboard

Dialogs should get focus by default

Open steverep opened this issue 3 years ago • 2 comments

The mwc-dialog component will only move initial focus onto the dialog when the dialogInitialFocus attribute is set on a slotted element. If not set, focus remains on the element that opened the dialog and must be moved to the dialog manually. This creates inaccessibility for assistive technology and is a WCAG failure.

I would recommend a change such that initial focus has a default inside the dialog when the attribute is not set, such as the least destructive action button or the heading text using tabindex="-1". There's no reason for a lazy implementation to be less accessible.

steverep avatar Feb 03 '22 21:02 steverep

Thanks for the bug report! Adding to our backlog

asyncliz avatar Feb 11 '22 20:02 asyncliz

@asyncLiz maybe this is the behavior the getInitialFocusEl function at mwc-dialog-base.ts is doing? it seem that the focusable element should is supposed to be dialogInitialFocus would be good to change to .mdc-dialog ?

schirrel avatar Jun 04 '22 22:06 schirrel

Obsolete with M3's dialog

asyncliz avatar Aug 02 '23 02:08 asyncliz