aria-role-dialog

Description

Ensures that element with attribute role="dialog" is having defined an accessible name.

Context

Using role="dialog" on the HTML element helps assistive technology identify the dialog’s content as being grouped and separated from the rest of the page content. However, having only role="dialog" defined alone is not sufficient to make a dialog accessible. Additionally, the following needs to be done:

1. The dialog must be properly labeled
2. Keyboard focus must be managed correctly

Note: when possible you may consider using native <dialog> box feature.

How to fix it

The rule passes when one of the following cases is fulfilled:

1. Attribute aria-labelledby is defined AND is not empty.
2. Attribute aria-label is defined AND is not empty.
3. Attribute title is defined AND is not empty.

Standard

Accessibility, Best Practices, SiteLint