[a11y]: [UI Shell] [SideNav with Divider] - Screen reader misinterprets two lists as one and counts the divider as an item

[2nikhiltom]

Package

@carbon/react

Browser

Firefox

Operating System

Windows

Package version

v1.60.3

React version

18.02

Automated testing tool and ruleset

Manual QA

Assistive technology

JAWS

Description

Visually, there are two distinct lists separated by a divider. The first list contains three items, and the second list contains two items. However, the screen reader announces these as a single list and incorrectly counts the divider as an additional item.

Two different list should be defined and screen reader should announce the list items count along with the list correctly.

WCAG 2.1 Violation

No response

Reproduction/example

https://react.carbondesignsystem.com/?path=/story/components-ui-shell-sidenav--fixed-side-nav-w-divider

Suggested Severity

Severity 3 = User can complete task, and/or has a workaround within the user experience of a given component.

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate problems