Adjust aria attributes to improve accessibility

Created on 19 May 2023, almost 2 years ago
Updated 15 August 2023, over 1 year ago

Problem/Motivation

The collapse button doesn't convey that it's a button or that it controls collapsible content. The existing aria attributes need to be adjusted to make it more accessible.

Proposed resolution

  • Remove aria-role="link" from the collapse button.
  • Move aria-expanded from the collapsible content section to the collapse button.
  • Set the initial aria-expanded state on page load.
  • Add aria-controls to link the collapse button & collapsible content section.
  • Remove aria-hidden from the collapsible content section. ("display: none;" is already hiding the content for all users, including screen readers, so it's redundant.)
πŸ› Bug report
Status

Fixed

Version

4.0

Component

Code

Created by

πŸ‡ΊπŸ‡ΈUnited States hbrokmeier Wisconsin

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.71.5 2024