chore(suiteheader and headeraction): fix accessibility scan violations

#3804
carbon-design-system · Jun 21, 2023 · afddacb · afddacb
1 parent c8021cb
commit afddacb
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 16 deletions.
diff --git a/packages/react/src/components/Header/Header.test.e2e.jsx b/packages/react/src/components/Header/Header.test.e2e.jsx
@@ -211,7 +211,7 @@ describe(
         cy.findByLabelText('Announcements').should('not.exist');
         cy.findByRole('button', { name: 'help' }).should('not.exist');
         cy.findByRole('button', { name: 'open and close list of options' }).click();
-        cy.findByRole('button', { name: 'Announcements', label: 'Announcements' })
+        cy.findByRole('menuitem', { name: 'Announcements' })
           .should('be.visible')
           .click()
           .should(() => {
@@ -251,9 +251,7 @@ describe(
         cy.findByRole('button', { name: 'open and close list of options' }).click(5, 5, {
           force: true,
         });
-        cy.findByRole('button', { name: 'Announcements', label: 'Announcements' }).should(
-          'be.visible'
-        );
+        cy.findByRole('menuitem', { name: 'Announcements' }).should('be.visible');
       });
 
       it('should hide header action actions in a small viewport in RTL', () => {
@@ -281,7 +279,7 @@ describe(
         cy.findByLabelText('Announcements').should('not.exist');
         cy.findByRole('button', { name: 'help' }).should('not.exist');
         cy.findByRole('button', { name: 'open and close list of options' }).click();
-        cy.findByRole('button', { name: 'Announcements', label: 'Announcements' })
+        cy.findByRole('menuitem', { name: 'Announcements' })
           .should('be.visible')
           .click()
           .should(() => {
@@ -306,9 +304,7 @@ describe(
         mount(<Header {...commonProps} isActionItemVisible={isActionItemVisible} />);
 
         cy.findByRole('button', { name: 'open and close list of options' }).click();
-        cy.findByRole('button', { name: 'Announcements', label: 'Announcements' }).should(
-          'be.visible'
-        );
+        cy.findByRole('menuitem', { name: 'Announcements' }).should('be.visible');
         cy.findByRole('button', { name: 'Custom icon 1', label: 'Custom icon 1' }).should(
           'not.exist'
         );
@@ -329,9 +325,7 @@ describe(
         mount(<Header {...commonProps} />);
 
         cy.findByRole('button', { name: 'open and close list of options' }).click();
-        cy.findByRole('button', { name: 'Announcements', label: 'Announcements' }).should(
-          'be.visible'
-        );
+        cy.findByRole('menuitem', { name: 'Announcements' }).should('be.visible');
         // I don't know if this is actually necessary in cypress, but just to be safe.
         cy.window().then((win) => {
           Object.defineProperty(win, 'innerWidth', {

diff --git a/packages/react/src/components/PageTitleBar/PageTitleBar.test.e2e.jsx b/packages/react/src/components/PageTitleBar/PageTitleBar.test.e2e.jsx
@@ -119,7 +119,7 @@ describe('PageTitleBar', () => {
       .should(
         'have.attr',
         'style',
-        '--header-offset:48px; --negative-header-offset:-48px; --scroll-transition-progress:1;'
+        '--header-offset: 48px; --negative-header-offset: -48px; --scroll-transition-progress: 1;'
       );
   });
 
@@ -174,7 +174,7 @@ describe('PageTitleBar', () => {
       .should(
         'have.attr',
         'style',
-        '--header-offset:40px; --negative-header-offset:-40px; --scroll-transition-progress:1;'
+        '--header-offset: 40px; --negative-header-offset: -40px; --scroll-transition-progress: 1;'
       );
 
     breadcrumbsAndTabsAreStickyAndInTheCorrectPosition();
@@ -216,7 +216,7 @@ describe('PageTitleBar', () => {
       .should(
         'have.attr',
         'style',
-        '--header-offset:40px; --negative-header-offset:-40px; --scroll-transition-progress:1;'
+        '--header-offset: 40px; --negative-header-offset: -40px; --scroll-transition-progress: 1;'
       );
 
     cy.scrollTo(0, 50);
@@ -270,7 +270,7 @@ describe('PageTitleBar', () => {
       .should(
         'have.attr',
         'style',
-        '--header-offset: 0px; --negative-header-offset: 0px; --scroll-transition-progress: 0;'
+        '--header-offset: 0px; --negative-header-offset: -0px; --scroll-transition-progress: 0;'
       );
 
     cy.scrollTo(0, 250);
@@ -281,7 +281,7 @@ describe('PageTitleBar', () => {
       .should(
         'have.attr',
         'style',
-        '--header-offset:0px; --negative-header-offset:0px; --scroll-transition-progress:1;'
+        '--header-offset: 0px; --negative-header-offset: 0px; --scroll-transition-progress: 1;'
       );
 
     tabsAreStickyAndBreadcrumbsAreHidden();