New tests changes

src/layouts/MainLayout.vue

@@ -76,7 +76,12 @@ const logoutSupplantedUser = async () => {
                 </QBtn>
             </QToolbar>
         </QHeader>
-        <QDrawer v-model="leftDrawerOpen" :width="250" show-if-above>
+        <QDrawer
+            v-model="leftDrawerOpen"
+            :width="250"
+            show-if-above
+            data-testid="layoutMenuDrawer"
+        >
             <QToolbar class="logo">
                 <img src="statics/logo-dark.svg" />
             </QToolbar>

src/pages/Ecomerce/PendingOrders.vue

@@ -71,6 +71,7 @@ onMounted(async () => {
 <template>
     <Teleport v-if="isHeaderMounted" to="#actions">
         <QBtn
+            data-testid="pendingOrdersNewOrder"
             :to="{ name: 'checkout' }"
             icon="add_shopping_cart"
             :label="t('newOrder')"
@@ -83,11 +84,16 @@ onMounted(async () => {
         </QBtn>
     </Teleport>
     <QPage class="vn-w-sm">
-        <VnList :rows="orders" :loading="loading">
+        <VnList
+            :rows="orders"
+            :loading="loading"
+            data-testid="pendingOrdersList"
+        >
             <CardList
                 v-for="(order, index) in orders"
                 :key="index"
                 :to="{ name: 'basket', params: { id: order.id } }"
+                data-testid="pendingOrderCard"
             >
                 <template #content>
                     <QItemLabel class="text-bold q-mb-sm">

src/test/cypress/integration/UserFlows.spec.js

@@ -0,0 +1,31 @@
+describe('User flow 1', () => {
+    // 1- Loguear como empleado
+    // 2- Ir a la sección de pedidos pendientes
+    // 3- Crear un pedido
+    beforeEach(() => {
+        cy.changeLanguage('es');
+    });
+
+    it('should log in successfully', () => {
+        // 1- Loguear como empleado
+        cy.loginFlow('employee');
+
+        // 2- Ir a la sección de pedidos pendientes
+        cy.visit('/#/ecomerce/pending');
+        cy.get('[data-testid="pendingOrdersNewOrder"]').should('exist');
+        cy.get('[data-testid="pendingOrdersNewOrder"]').click();
+        // 3- Crear un pedido
+        cy.url().should('contain', '/#/ecomerce/checkout');
+        cy.get('[data-testid="checkoutStepper"]').should('exist');
+        cy.get('[data-testid="checkoutStepper"]').should(
+            'contain',
+            '¿Quieres recibir o recoger el pedido?'
+        );
+        cy.get('[aria-label="Recibir en mi tienda"]').click();
+        cy.get('[data-testid="checkoutStepperRightButton"]').click();
+        cy.get('[data-testid="checkoutStepper"]').should(
+            'contain',
+            '¿Qué día quieres recibir el pedido?'
+        );
+    });
+});

src/test/cypress/integration/login/LoginView.spec.js

@@ -19,9 +19,10 @@ describe('Login Tests', () => {
 
     it('should select a language from the dropdown', () => {
         cy.get('[data-testid="switchLanguage"]').should('exist');
-        cy.get('[data-testid="switchLanguage"]').click();
-        cy.get('.q-item').contains('English').click();
-        cy.get('[data-testid="switchLanguage"]').should('contain', 'en');
+        cy.changeLanguage('en');
+        cy.get('button[type="submit"]').should('contain', 'Log in');
+        cy.changeLanguage('es');
+        cy.get('button[type="submit"]').should('contain', 'Iniciar sesión');
     });
 
     it('should fail to log in using wrong user', () => {
@@ -45,10 +46,7 @@ describe('Login Tests', () => {
     });
 
     it('should log in', () => {
-        cy.get('[data-testid="loginUserInput"]').type('employee');
-        cy.get('[data-testid="loginPasswordInput"]').type('nightmare');
-        cy.get('button[type="submit"]').click();
-        cy.url().should('contain', '/#/cms/home');
+        cy.loginFlow('employee');
     });
 
     it('should log in as guest', () => {

src/test/cypress/support/commands.js

@@ -22,4 +22,60 @@
 //
 //
 // -- This will overwrite an existing command --
-// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+
+Cypress.Commands.add('login', user => {
+    cy.request({
+        method: 'POST',
+        url: '/api/Accounts/login',
+        body: {
+            user,
+            password: 'nightmare'
+        }
+    }).then(response => {
+        window.localStorage.setItem('token', response.body.token);
+        cy.request({
+            method: 'GET',
+            url: '/api/VnUsers/ShareToken',
+            headers: {
+                Authorization: window.localStorage.getItem('token')
+            }
+        }).then(({ body }) => {
+            window.localStorage.setItem(
+                'tokenMultimedia',
+                body.multimediaToken.id
+            );
+        });
+    });
+});
+
+Cypress.Commands.add('loginFlow', user => {
+    cy.visit('/#/login');
+    cy.get('[data-testid="loginUserInput"]').type(user);
+    cy.get('[data-testid="loginPasswordInput"]').type('nightmare');
+    cy.get('button[type="submit"]').click();
+    cy.url().should('contain', '/#/cms/home');
+});
+
+Cypress.Commands.add('logout', user => {
+    cy.request({
+        method: 'POST',
+        url: 'Accounts/logout'
+    }).then(response => {
+        localStorage.clear();
+        sessionStorage.clear();
+    });
+});
+
+Cypress.Commands.add('waitForElement', (element, timeout = 5000) => {
+    cy.get(element, { timeout }).should('be.visible');
+});
+
+Cypress.Commands.add('changeLanguage', language => {
+    const languagesOrder = ['en', 'es', 'ca', 'fr', 'pt'];
+    const index = languagesOrder.indexOf(language);
+    cy.visit('/#/login');
+    cy.waitForElement('[data-testid="switchLanguage"]');
+    cy.get('[data-testid="switchLanguage"]').click();
+    cy.get('.q-menu .q-item').eq(index).click(); // Selecciona y hace clic en el tercer elemento "index" de la lista
+});