fix: ContextualMenuSplitButton always sets aria-checked (does not lea…

…ve it undefined) when it is checkable (microsoft#27650) * fix: ContextualMenuSplitButton always sets aria-checked (does not leave it undefined) when it is checkable. * Adding change file.
marcosmoura · Apr 25, 2023 · 133e4ae · 133e4ae
1 parent 5c489e4
commit 133e4ae
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/change/@fluentui-react-8279ee8e-b6e5-4f7f-b9e7-18a13d31e6cb.json b/change/@fluentui-react-8279ee8e-b6e5-4f7f-b9e7-18a13d31e6cb.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix: ContextualMenuSplitButton always sets aria-checked (does not leave it undefined) when it is checkable.",
+  "packageName": "@fluentui/react",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}
diff --git a/...act/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.tsx b/...act/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.tsx
@@ -12,7 +12,7 @@ import {
 import { ContextualMenuItem } from '../ContextualMenuItem';
 import { getSplitButtonVerticalDividerClassNames } from '../ContextualMenu.classNames';
 import { KeytipData } from '../../../KeytipData';
-import { isItemDisabled, hasSubmenu, getMenuItemAriaRole } from '../../../utilities/contextualMenu/index';
+import { getIsChecked, getMenuItemAriaRole, hasSubmenu, isItemDisabled } from '../../../utilities/contextualMenu/index';
 import { VerticalDivider } from '../../../Divider';
 import { ContextualMenuItemWrapper } from './ContextualMenuItemWrapper';
 import type { IContextualMenuItem } from '../ContextualMenu.types';
@@ -85,6 +85,8 @@ export class ContextualMenuSplitButton extends ContextualMenuItemWrapper {
       this._ariaDescriptionId = getId();
     }
 
+    const ariaChecked = getIsChecked(item) ?? undefined;
+
     return (
       <KeytipData keytipProps={keytipProps} disabled={isItemDisabled(item)}>
         {(keytipAttributes: any): JSX.Element => (
@@ -102,7 +104,7 @@ export class ContextualMenuSplitButton extends ContextualMenuItemWrapper {
               ariaDescription ? this._ariaDescriptionId : undefined,
               keytipAttributes['aria-describedby'],
             )}
-            aria-checked={item.isChecked || item.checked}
+            aria-checked={ariaChecked}
             aria-posinset={focusableElementIndex + 1}
             aria-setsize={totalItemCount}
             onMouseEnter={this._onItemMouseEnterPrimary}