chore: Fix product search e2e tests (#19468)

SAP · Oct 31, 2024 · 76f785c · 76f785c
1 parent 5d1b2b8
commit 76f785c
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 6 deletions.
diff --git a/projects/storefrontapp-e2e-cypress/cypress/e2e/accessibility/keyboard-navigation.e2e.cy.ts b/projects/storefrontapp-e2e-cypress/cypress/e2e/accessibility/keyboard-navigation.e2e.cy.ts
@@ -44,6 +44,13 @@ describe('Kayboard navigation', () => {
 
   context('Facet component', () => {
     beforeEach(() => {
+      // TODO: No longer needed to toggle a11yTabComponent feature when set to true
+      // by default.
+      cy.cxConfig({
+        features: {
+          a11yTabComponent: true,
+        },
+      });
       cy.visit('/Brands/all/c/brands');
       cy.get('cx-facet-list button.tab-btn').first().as('facetHeader');
       cy.get('cx-facet a').first().as('firstFacetOption');

diff --git a/...-cypress/cypress/e2e/regression/product-search/product-search-product-type-flow.e2e.cy.ts b/...-cypress/cypress/e2e/regression/product-search/product-search-product-type-flow.e2e.cy.ts
@@ -20,6 +20,15 @@ context('Product search product type flow', () => {
   viewportContext(['mobile', 'desktop'], () => {
     before(() => {
       cy.window().then((win) => win.sessionStorage.clear());
+
+      // TODO: No longer needed to toggle a11yTabComponent feature when set to true
+      // by default.
+      cy.cxConfig({
+        features: {
+          a11yTabComponent: true,
+        },
+      });
+
       cy.visit('/');
     });
 
@@ -63,7 +72,7 @@ context('Product search product type flow', () => {
         assertNumberOfProducts(`@${QUERY_ALIAS.SONY}`, `"${category}"`);
 
         // Filter by brand
-        clickFacet('Brand');
+        clickFacet('Brand', true);
 
         cy.wait(`@${QUERY_ALIAS.BRAND_PAGE}`)
           .its('response.statusCode')
@@ -80,7 +89,7 @@ context('Product search product type flow', () => {
         assertNumberOfProducts(`@${QUERY_ALIAS.SONY}`, `"${category}"`);
 
         // Filter by price
-        clickFacet('Price');
+        clickFacet('Price', true);
 
         cy.wait(`@${QUERY_ALIAS.PRICE_DSC_FILTER}`)
           .its('response.statusCode')
@@ -103,7 +112,7 @@ context('Product search product type flow', () => {
         );
 
         // Filter by category
-        clickFacet('Category');
+        clickFacet('Category', true);
 
         cy.wait(`@${QUERY_ALIAS.CATEGORY_FILTER}`)
           .its('response.statusCode')
@@ -125,7 +134,7 @@ context('Product search product type flow', () => {
           `"${category}"`
         );
 
-        clickFacet('Color');
+        clickFacet('Color', true);
 
         cy.wait(`@${QUERY_ALIAS.COLOR_FILTER}`)
           .its('response.statusCode')

diff --git a/...app-e2e-cypress/cypress/e2e/regression/product-search/product-search-store-flow.e2e.cy.ts b/...app-e2e-cypress/cypress/e2e/regression/product-search/product-search-store-flow.e2e.cy.ts
@@ -22,6 +22,15 @@ context('Product search store flow', () => {
   viewportContext(['desktop', 'mobile'], () => {
     before(() => {
       cy.window().then((win) => win.sessionStorage.clear());
+
+      // TODO: No longer needed to toggle a11yTabComponent feature when set to true
+      // by default.
+      cy.cxConfig({
+        features: {
+          a11yTabComponent: true,
+        },
+      });
+
       cy.visit('/');
     });
 

diff --git a/projects/storefrontapp-e2e-cypress/cypress/helpers/product-search.ts b/projects/storefrontapp-e2e-cypress/cypress/helpers/product-search.ts
@@ -227,14 +227,14 @@ export function checkFirstItem(productName: string): void {
     });
 }
 
-export function clickFacet(header: string) {
+export function clickFacet(header: string, force = false) {
   cy.onMobile(() => {
     cy.get('cx-product-facet-navigation button').click();
   });
   cy.get('cx-facet-list cx-tab button.tab-btn')
     .contains(header)
     .then((el) => {
-      if (el.find('.fa-plus').is(':visible')) {
+      if (el.find('.tab-icon[outerText^="+"]').length || force) {
         // TODO Remove force once you can scroll facets on mobile
         cy.wrap(el).click({ force: true });
       }