Merge pull request #6392 from Sage/FE-6249-button-role-typo

fix(multi-action-button, split-button): fix aria role
Sage · Nov 8, 2023 · 63c84ec · 63c84ec
2 parents cb36b23 + 0a41831
commit 63c84ec
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 1 deletion.
diff --git a/cypress/components/multi-action-button/multi-action-button.cy.tsx b/cypress/components/multi-action-button/multi-action-button.cy.tsx
@@ -720,6 +720,15 @@ context("Tests for MultiActionButton component", () => {
       cy.checkAccessibility();
     });
 
+    // TODO: test passes even when it shouldn't, see FE-6267
+    it("should pass accessibility tests for MultiActionButton when open", () => {
+      CypressMountWithProviders(<MultiActionButtonList />);
+
+      multiActionButton().eq(0).trigger("keydown", keyCode("Enter"));
+
+      cy.checkAccessibility();
+    });
+
     it("should pass accessibility tests for MultiActionButton disabled prop", () => {
       CypressMountWithProviders(<MultiActionButtonList disabled />);
 

diff --git a/cypress/components/split-button/split-button.cy.tsx b/cypress/components/split-button/split-button.cy.tsx
@@ -754,6 +754,15 @@ context("Tests for SplitButton component", () => {
       cy.checkAccessibility();
     });
 
+    // TODO: test passes even when it shouldn't, see FE-6267
+    it("should pass accessibility tests for SplitButton Default story when open", () => {
+      CypressMountWithProviders(<SplitButtonList />);
+
+      splitToggleButton().eq(0).trigger("keydown", keyCode("downarrow"));
+
+      cy.checkAccessibility();
+    });
+
     it("should pass accessibility tests for SplitButton Default story when the additional buttons are opened", () => {
       CypressMountWithProviders(<SplitButtonList />);
 

diff --git a/src/components/button/button.component.tsx b/src/components/button/button.component.tsx
@@ -293,7 +293,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
         buttonType={buttonType}
         disabled={disabled}
         destructive={destructive}
-        role={inSplitButton ? "menu-item" : "button"}
+        role={inSplitButton ? "menuitem" : "button"}
         type={href ? undefined : "button"}
         iconType={iconType}
         size={size}