search

carbon-design-system / carbon-components-angular

An Angular implementation of the Carbon Design System for IBM.
https://angular.carbondesignsystem.com
Apache License 2.0
528 stars 299 forks source link

[AVT] Insights Dashboard: The WAI-ARIA role or attribute 'aria-expanded' is not valid for the element <div> #1463

Open UjjwalUpadhyay123-bit opened 4 years ago

UjjwalUpadhyay123-bit commented 4 years ago

Detailed description

Need to remove 'aria-expanded' as 'aria-expanded' is not valid for the element

Is this a feature request (new component, new icon), a bug, or a general issue? Bug

Is this issue related to a specific component? No

What did you expect to happen? What happened instead? What would you like to see changed? Expected to see no accessibility issue. Got the above AAT issue.

What browser are you working in? Chrome

What version of the Carbon Design System are you using? 10.11.1

What offering/product do you work on? Any pressing ship or release dates we should be aware of?

Steps to reproduce the issue

  1. Go to https://ecamstage14.multicloud-ibm.com/lite/insights/insightsdashboard
  2. Use DAP to scan (The same problem in https://ecamstage14.multicloud-ibm.com/lite/insights/ridashboard)

Additional information

AAT-ARIA Issue AAT-Aria2

cal-smith commented 4 years ago

Please provide all of the following information:

UjjwalUpadhyay123-bit commented 4 years ago
  1. combobox is the component
  2. "carbon-components-angular": "3.49.7"
  3. Angular version - 7.2.15
  4. Name, Role. Value - The WAI-ARIA role or attribute 'aria-expanded' is not valid for the element
UjjwalUpadhyay123-bit commented 4 years ago

@cal-smith - Any updates on this?

cal-smith commented 4 years ago 
4. Name, Role. Value - The WAI-ARIA role or attribute 'aria-expanded' is not valid for the element

This isn't a ruleset, this is the information message. If you go into the DAP options, which ruleset are you using? It should be the most recent on ("latest" or whatever the most recent release is otherwise)

Ensure that you update to the latest version of carbon-components-angular@3 (v3.53.9 at the time of writing) - The dropdown is using role="button" which has aria-expanded as a valid attribute - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role

This appears to be a false positive from DAP.

UjjwalUpadhyay123-bit commented 4 years ago 
4. Name, Role. Value - The WAI-ARIA role or attribute 'aria-expanded' is not valid for the element

This isn't a ruleset, this is the information message. If you go into the DAP options, which ruleset are you using? It should be the most recent on ("latest" or whatever the most recent release is otherwise)

Ensure that you update to the latest version of carbon-components-angular@3 (v3.53.9 at the time of writing) - The dropdown is using role="button" which has aria-expanded as a valid attribute - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role

This appears to be a false positive from DAP.

I tried increasing the carbon-components-angular to 3.53,9 from 3.49.7 but it did not help solve this issue. cc: @cal-smith

r4d commented 4 years ago

I think this might be a "role" issue. The image shows that "type" is set to "button", but the role isn't set.

<div id="blah" tabindex="0" role="button" aria-expanded="false"></div>

reference: https://www.w3.org/WAI/PF/aria/states_and_properties#aria-expanded

@UjjwalUpadhyay123-bit , you should check that adding role="button" clears the error and confirm in this thread.