-
Notifications
You must be signed in to change notification settings - Fork 2.9k
Closed
Labels
Area: AccessibilityComponent: ContextualMenuFluent UI react (v8)Issues about @fluentui/react (v8)Issues about @fluentui/react (v8)Status: FixedFixed in some PRFixed in some PRType: Bug 🐛
Description
Library
React / v8 (@fluentui/react)
System Info
Package version: @fluentui/react: 8.93.1Are you reporting Accessibility issue?
yes
Reproduction
https://developer.microsoft.com/en-us/fluentui#/controls/web/contextualmenu
Bug Description
Repro Steps
- Navigate to the documentation for the ContextualMenu component: https://developer.microsoft.com/en-us/fluentui#/controls/web/contextualmenu
- Find the "ContextualMenu with checkable menu items and toggleable split button" example
- Open the contextual menu
- Run the Accessibility Insights for Web fast pass.
Actual Behavior
Implementations of the FluentUI ContextualMenu are currently failing the Accessibility Insights for Web fast pass. See screenshots and attached logs.
Expected Behavior
The ContextualMenu component should pass the Accessibility Insights for Web fast pass without any accessibility issues.
Logs
Title: WCAG 4.1.2: Ensures elements with ARIA roles have all required ARIA attributes (.splitContainer-422[aria-posinset="6"][role="menuitemcheckbox"])
Tags: Accessibility, WCAG 4.1.2, aria-required-attr
Issue: Ensures elements with ARIA roles have all required ARIA attributes (aria-required-attr - https://accessibilityinsights.io/info-examples/web/aria-required-attr)
Target application: Fluent UI - Controls - React - ContextualMenu - https://developer.microsoft.com/en-us/fluentui#/controls/web/contextualmenu
Element path: .splitContainer-422[aria-posinset="6"][role="menuitemcheckbox"]
Snippet: <div role="menuitemcheckbox" class="splitContainer-422" aria-disabled="false" aria-expanded="false" aria-haspopup="true" aria-posinset="6" aria-setsize="10" tabindex="-1" data-is-focusable="true">
How to fix:
Fix any of the following:
Required ARIA attribute not present: aria-checked
Environment: Microsoft Edge version 112.0.1722.39
====
This accessibility issue was found using Accessibility Insights for Web 2.38.1 (axe-core 4.6.3), a tool that helps find and fix accessibility issues. Get more information & download this tool at http://aka.ms/AccessibilityInsights.Requested priority
Blocking
Products/sites affected
No response
Are you willing to submit a PR to fix?
no
Validations
- Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- The provided reproduction is a minimal reproducible example of the bug.
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
Area: AccessibilityComponent: ContextualMenuFluent UI react (v8)Issues about @fluentui/react (v8)Issues about @fluentui/react (v8)Status: FixedFixed in some PRFixed in some PRType: Bug 🐛

