Search results

Accessibility in Vue Message component

08 Feb 2023 / 1 minute to read

The Message component has been designed keeping in mind the WAI-ARIA specifications and applies WAI-ARIA roles, states, and properties along with keyboard support. This component is characterized by complete keyboard interaction support and ARIA accessibility support, making it easy for people who use assistive technologies (AT) and those who completely rely on keyboard navigation.

ARIA attributes

The following ARIA attributes are used in the Message:

  • alert (role).
  • aria-label (attribute).

Keyboard interaction

The Message functionalities can be interactive with keyboard shortcuts. The following keyboard shortcuts are supported by the Message.

Press To do this
Tab / Shift + Tab To focus the close icon in the message.
Enter / Space Closes the focused close icon’s message.