fix: e2e tests for eu responsible person drawer

apps/web/__tests__/support/pageObjects/ProductManufacturerPageObject.ts

@@ -0,0 +1,62 @@
+import { PageObject } from "./PageObject";
+
+export class ProductManufacturerPageObject extends PageObject {
+  get manufacturerDrawerTrigger() {
+    return cy.getByTestId('open-manufacturer-drawer');
+  }
+
+  get manufacturerResponsibleInfo() {
+    return cy.getByTestId('ManufacturerResponsibleInfo');
+  }
+
+  get manufacturerResponsibleInformation() {
+    return cy.getByTestId('ManufacturerInformation');
+  }
+  get manufacturerResponsibleInformationName() {
+    return cy.getByTestId('manufacturer-responsible-info-name');
+  }
+  get manufacturerResponsibleInformationStreet() {
+    return cy.getByTestId('manufacturer-responsible-info-street');
+  }
+  get manufacturerResponsibleInformationPostcode() {
+    return cy.getByTestId('manufacturer-responsible-info-postcode');
+  }
+  get manufacturerResponsibleInformationPhone() {
+    return cy.getByTestId('manufacturer-responsible-info-phone');
+  }
+  get manufacturerResponsibleInformationEmail() {
+    return cy.getByTestId('manufacturer-responsible-info-email');
+  }
+  get manufacturerInformationName() {
+    return cy.getByTestId('manufacturerInfo-name');
+  }
+  get productLegalDetailsClose() {
+    return cy.getByTestId('product-legal-details-close');
+  }
+
+  displayCheck() {
+    this.assertProductManufacturerPageElements();
+    return this;
+  }
+
+  assertProductManufacturerPageElements() {
+    this.manufacturerDrawerTrigger.should('be.visible');
+    this.manufacturerDrawerTrigger.click();
+    this.manufacturerResponsibleInfo.should('be.visible');
+    this.manufacturerResponsibleInformation.should('be.visible');
+
+    // this.manufacturerResponsibleInformationName.should('be.visible');
+    // this.manufacturerResponsibleInformationStreet.should('be.visible');
+    // this.manufacturerResponsibleInformationPostcode.should('be.visible');
+    // this.manufacturerResponsibleInformationPhone.should('be.visible');
+    // this.manufacturerResponsibleInformationEmail.should('be.visible');
+
+
+    this.manufacturerResponsibleInformation.click()
+    // this.manufacturerInformationName.should('be.visible');
+    this.productLegalDetailsClose.click();
+
+    this.manufacturerResponsibleInfo.should('not.exist');
+    return this;
+  }
+}

apps/web/__tests__/test/smoke/manufacturerPage.cy.ts

@@ -0,0 +1,21 @@
+import { ProductManufacturerPageObject } from '../../support/pageObjects/ProductManufacturerPageObject';
+import { paths } from '../../../utils/paths';
+import { HomePageObject } from '../../support/pageObjects/HomePageObject';
+import { ProductListPageObject } from '../../support/pageObjects/ProductListPageObject';
+
+const productManufacturerPage = new ProductManufacturerPageObject();
+const homePage = new HomePageObject();
+const productListPage = new ProductListPageObject();
+
+
+describe('Smoke: Product Manufacturer Page', () => {
+  it('[smoke] Open product page and check manufacturer information si available', () => {
+    cy.clearCookies();
+    cy.setCookie('consent-cookie', '{"Essentials":{"Session":true,"Consent":true,"Session2":true},"External Media":{"Session":false,"Consent":false,"Session2":false},"Functional":{"Session":false,"Consent":false,"Session2":false},"Marketing":{"Session":false,"Consent":false,"Session2":false}}')
+    cy.visitAndHydrate(paths.home);
+    homePage.goToCategory();
+    productListPage.goToProduct();
+
+    productManufacturerPage.displayCheck();
+  });
+});

apps/web/components/ManufacturerInformation/ManufacturerInformation.vue

@@ -9,7 +9,7 @@
       <p v-if="manufacturerInfo.logo">
         <NuxtImg :src="manufacturerInfo.logo" :alt="t('manufacturer.logoAlt')" loading="lazy" />
       </p>
-      <p v-if="manufacturerInfo.name">{{ manufacturerInfo.name }}</p>
+      <p v-if="manufacturerInfo.name" data-testid="manufacturerInfo-name">{{ manufacturerInfo.name }}</p>
       <p v-else-if="manufacturerInfo.externalName">{{ manufacturerInfo.externalName }}</p>
       <p v-if="manufacturerInfo.legalName">{{ manufacturerInfo.legalName }}</p>
       <p v-if="manufacturerInfo.street || manufacturerInfo.houseNo">

apps/web/components/ManufacturerResponsibleInfo/ManufacturerResponsibleInfo.vue

@@ -6,8 +6,13 @@
     <p class="mb-2">{{ t('manufacturer.responsibleSubtitle') }}</p>
 
     <div class="border-2 py-2 px-4">
-      <p v-if="manufacturerResponsibleInfo.name">{{ manufacturerResponsibleInfo.name }}</p>
-      <p v-if="manufacturerResponsibleInfo.street || manufacturerResponsibleInfo.houseNo">
+      <p v-if="manufacturerResponsibleInfo.name" data-testid="manufacturer-responsible-info-name">
+        {{ manufacturerResponsibleInfo.name }}
+      </p>
+      <p
+        v-if="manufacturerResponsibleInfo.street || manufacturerResponsibleInfo.houseNo"
+        data-testid="manufacturer-responsible-info-street"
+      >
         {{ manufacturerResponsibleInfo.street }} {{ manufacturerResponsibleInfo.houseNo }}
       </p>
       <p
@@ -16,14 +21,19 @@
           manufacturerResponsibleInfo.town ||
           manufacturerResponsibleInfo.country
         "
+        data-testid="manufacturer-responsible-info-postcode"
       >
         {{ manufacturerResponsibleInfo.postCode }}
         <span v-if="manufacturerResponsibleInfo.town"> {{ manufacturerResponsibleInfo.town }}</span>
         <span v-if="manufacturerResponsibleInfo.town && manufacturerResponsibleInfo.country">, &nbsp;</span>
         <span v-if="manufacturerResponsibleInfo.country">{{ manufacturerResponsibleInfo.country.name }}</span>
       </p>
-      <p v-if="manufacturerResponsibleInfo.phoneNo">{{ t('phone') }}: {{ manufacturerResponsibleInfo.phoneNo }}</p>
-      <p v-if="manufacturerResponsibleInfo.email">{{ t('email') }}: {{ manufacturerResponsibleInfo.email }}</p>
+      <p v-if="manufacturerResponsibleInfo.phoneNo" data-testid="manufacturer-responsible-info-phone">
+        {{ t('phone') }}: {{ manufacturerResponsibleInfo.phoneNo }}
+      </p>
+      <p v-if="manufacturerResponsibleInfo.email" data-testid="manufacturer-responsible-info-email">
+        {{ t('email') }}: {{ manufacturerResponsibleInfo.email }}
+      </p>
       <p v-if="manufacturerResponsibleInfo.responsibleContactUrl">
         {{ t('responsibleContactUrl') }}: {{ manufacturerResponsibleInfo.responsibleContactUrl }}
       </p>

apps/web/components/ProductLegalDetailsDrawer/ProductLegalDetailsDrawer.vue

@@ -3,6 +3,7 @@
     <SfDrawer
       ref="productLegalDrawerRef"
       v-model="open"
+      data-testid="product-legal-details-drawer"
       :placement="placement"
       :class="[
         'lg:w-128',
@@ -15,7 +16,13 @@
     >
       <header class="flex items-center justify-between px-10 py-6 bg-primary-500">
         <div class="flex items-center text-white">{{ t('productLegalDetailsHeader') }}</div>
-        <UiButton square variant="tertiary" class="text-white" @click="open = false">
+        <UiButton
+          square
+          variant="tertiary"
+          data-testid="product-legal-details-close"
+          class="text-white"
+          @click="open = false"
+        >
           <SfIconClose />
         </UiButton>
       </header>
@@ -32,6 +39,7 @@
           :key="tab.label"
           type="button"
           role="tab"
+          :data-testid="tab.component.__name"
           :variant="isActiveTab(index) ? 'primary' : 'secondary'"
           :aria-selected="isActiveTab(index)"
           :aria-controls="`tabpanel-${index}`"
@@ -41,7 +49,6 @@
           {{ tab.label }}
         </UiButton>
       </div>
-
       <div
         v-for="(tab, index) in tabs"
         v-show="isActiveTab(index)"

apps/web/pages/product/[slug].vue

@@ -22,7 +22,7 @@
           />
 
           <div class="p-4 flex">
-            <p class="font-bold leading-6 cursor-pointer" @click="openDrawer()">
+            <p class="font-bold leading-6 cursor-pointer" data-testid="open-manufacturer-drawer" @click="openDrawer()">
               <span>{{ t('legalDetails') }}</span>
               <SfIconChevronRight />
             </p>

docs/changelog/changelog_en.md

@@ -14,6 +14,7 @@
 
 ### 🩹 Fixed
 
+- Added e2e tests for product manufacturer details tab.
 - Fixed an issue where required attributes notification was blocking the cart.
 - Fixed a visual inconsistency in the category filters sidebar.
 - Fixed accesibility error caused by missing label on clear filters.