Merge branch 'chore/6512-percy-coverage' of github.com:devadula-nanda…

…n/ibm-products into chore/6512-percy-coverage
carbon-design-system · Dec 13, 2024 · 1d2c3fe · 1d2c3fe
2 parents 6e3fae2 + fa16c76
commit 1d2c3fe
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 8 deletions.
diff --git a/e2e/components/AboutModal/AboutModal-test.avt.e2e.js b/e2e/components/AboutModal/AboutModal-test.avt.e2e.js
@@ -69,8 +69,8 @@ test.describe('AboutModal @avt', () => {
     await page.keyboard.press('Tab');
     await expect(closeIcon).toBeFocused();
 
-    // Press escape to twice
-    // first to close tooltip then close modal
+    // Press escape twice
+    // To close tooltip and modal
     await page.keyboard.press('Escape');
     await page.keyboard.press('Escape');
 

diff --git a/e2e/components/PageHeader/PageHeader-test.avt.e2e.js b/e2e/components/PageHeader/PageHeader-test.avt.e2e.js
@@ -9,7 +9,8 @@
 
 import { expect, test } from '@playwright/test';
 import { visitStory } from '../../test-utils/storybook';
-
+import { carbon } from '../../../packages/ibm-products/src/settings';
+import { pkg } from '../../../packages/ibm-products/src/settings';
 test.use({ viewport: { width: 1600, height: 900 } });
 
 test.describe('PageHeader @avt', () => {
@@ -121,6 +122,14 @@ test.describe('PageHeader @avt', () => {
         carbonTheme: 'white',
       },
     });
+    // Race conditions
+    // Wait for the "+13" tag element to appear and be visible
+    await page.waitForSelector(
+      `span.${carbon.prefix}--tag__label[title="+13"]`,
+      {
+        visible: true,
+      }
+    );
 
     // renders all buttons on large screens by default
     await pressTabKey(page, 15);
@@ -171,6 +180,15 @@ test.describe('PageHeader @avt', () => {
       },
     });
 
+    // Race conditions
+    // Wait for the "+13" tag element to appear and be visible
+    await page.waitForSelector(
+      `span.${carbon.prefix}--tag__label[title="+13"]`,
+      {
+        visible: true,
+      }
+    );
+
     // renders all buttons on large screens by default
     await pressTabKey(page, 15);
     await expect(
@@ -184,12 +202,18 @@ test.describe('PageHeader @avt', () => {
     await expect(
       page.getByRole('button', { name: 'Primary button' })
     ).toBeFocused();
+
+    // collapse the header
+    await pressTabKey(page, 3);
+    await page.keyboard.press('Enter');
+    await page.waitForSelector(
+      `.${pkg.prefix}--page-header__collapse-expand-toggle--collapsed`,
+      { visible: true }
+    );
+
     // reset focus to first focusable element
     await page.getByRole('link', { name: 'Home page' }).focus();
-    // changes position when header collapsed
-    await page.locator(`.page-header-stories__dummy-content`).first().hover();
-    await page.mouse.wheel(0, 180);
-    await pressTabKey(page, 4);
+    await pressTabKey(page, 3);
     await expect(
       page.getByRole('button', { name: 'Page actions...' })
     ).toBeFocused();

diff --git a/packages/ibm-products/src/components/CreateFullPage/CreateFullPage.stories.jsx b/packages/ibm-products/src/components/CreateFullPage/CreateFullPage.stories.jsx
@@ -57,7 +57,6 @@ export default {
     controls: { sort: 'requiredFirst' },
     percy: {
       waitForSelector: `button.${blockClass}__create-button`,
-      waitForSelector: `.${blockClass}__influencer`,
     },
   },