Shell and Shell Panel - Avoid inappropriate use of ARIA roles, states, and properties - (2036570578)

[dqateam]

Violation:

Avoid inappropriate use of ARIA roles, states, and properties

WCAG Reference:

• 4.1.2 Name, Role, Value

Severity:

5

Media Type:

ARIA

---

Areas for Remediation:

• Title: Shell and Shell Panel - Avoid inappropriate use of ARIA roles, states, and properties - (2036570578)
• Module: Shell and Shell Panel
  Pattern: ARIA - Inappropriate use of aria-label.]

Issue
There are buttons with inappropriate use of aria-label and title attribute. that renders out inaccurate information.

Occurrences
29 Shell and Shell Panel

• Navigate through the action bar
• Additional Block example
• A filter-enabled value list
• Layers action, for display purposes only

30 Shell Center Row

• Navigate through the action bar
• Additional Block example
• A filter-enabled value list
• Layers action, Indicator on
• Shell center row example

User Impact
When inappropriate ARIA roles, states, and/or properties are used, screen reader users will mistake these elements for other control structures or the use may prevent users of assistive technology from interacting with the control.

Code Reference

<button aria-controls="d2584e27-fb95-18bd-fe10-4e09e487eb07-region" aria-expanded="true" aria-label="Collapse" class="toggle" id="d2584e27-fb95-18bd-fe10-4e09e487eb07-button" title="Collapse">
(...)
</button>

Suggestion
Developers must avoid inappropriate use of ARIA roles, states, and/or properties. Remove aria-label and title attributes.

Compliant Code Example

<button aria-controls="d2584e27-fb95-18bd-fe10-4e09e487eb07-region" aria-expanded="true" class="toggle" id="d2584e27-fb95-18bd-fe10-4e09e487eb07-button">
(...)
</button>

---

Additional Resources:

• Report Source: Product accessibility evaluation conducted on the Calcite Design System in August, 2022.

[macandcheese]

This seems unrelated to Shell or Shell Panel - referenced code is not part of these components. Could we close this one?

[geospatialem]

The issue was with block, which was addressed in #5565.