diff --git a/package.json b/package.json index ff0782e7..c386547c 100644 --- a/package.json +++ b/package.json @@ -54,11 +54,11 @@ "@quasar/extras": "^1.0.0", "axios": "^0.21.1", "core-js": "^3.6.5", + "eslint-plugin-cypress": "^2.13.3", "js-yaml": "^3.12.1", "mootools": "^1.5.2", "pinia": "^2.0.11", "promise-polyfill": "^8.2.3", - "eslint-plugin-cypress": "^2.13.3", "quasar": "^2.6.0", "require-yaml": "0.0.1", "tinymce": "^6.3.0", diff --git a/src/pages/Ecomerce/CheckoutView.vue b/src/pages/Ecomerce/CheckoutView.vue index 301758f0..12da7061 100644 --- a/src/pages/Ecomerce/CheckoutView.vue +++ b/src/pages/Ecomerce/CheckoutView.vue @@ -30,7 +30,7 @@ const currentStep = ref('method'); const id = route.params.id; const orderForm = ref({ method: 'AGENCY', - date: '', + date: formatDate(Date.vnNew(), 'YYYY/MM/DD'), address: '' }); @@ -322,6 +322,7 @@ onMounted(async () => { :flat="isMobile" contracted class="default-radius stepper-container" + data-testid="checkoutStepper" > { {{ @@ -417,6 +419,7 @@ onMounted(async () => { option-label="description" option-value="id" :options="agencies" + data-testid="agencyStepSelect" />
{ option-label="description" option-value="id" :options="warehouses" + data-testid="pickupStepSelect" />
@@ -457,6 +461,7 @@ onMounted(async () => { icon="arrow_back" dense class="left-navigation-button" + data-testid="checkoutStepperLeftButton" > {{ t(`${step.backButtonLabel || 'back'}`) }} @@ -471,6 +476,7 @@ onMounted(async () => { " dense class="right-navigation-button" + data-testid="checkoutStepperRightButton" > {{ t(`${step.nextButtonLabel || 'next'}`) }} diff --git a/src/test/cypress/integration/UserFlows.spec.js b/src/test/cypress/integration/UserFlows.spec.js index bca27c3c..a5ce3254 100644 --- a/src/test/cypress/integration/UserFlows.spec.js +++ b/src/test/cypress/integration/UserFlows.spec.js @@ -6,7 +6,13 @@ describe('User flow 1', () => { cy.changeLanguage('es'); }); - it('should log in successfully', () => { + const checkoutNextStep = () => { + cy.get('[data-testid="checkoutStepperRightButton"]') + .should('be.visible') + .click(); + }; + + it('should success', () => { // 1- Loguear como empleado cy.loginFlow('employee'); @@ -22,10 +28,33 @@ describe('User flow 1', () => { '¿Quieres recibir o recoger el pedido?' ); cy.get('[aria-label="Recibir en mi tienda"]').click(); - cy.get('[data-testid="checkoutStepperRightButton"]').click(); + + checkoutNextStep(); cy.get('[data-testid="checkoutStepper"]').should( 'contain', '¿Qué día quieres recibir el pedido?' ); + checkoutNextStep(); + cy.get('[data-testid="checkoutStepper"]').should( + 'contain', + '¿Dónde quieres recibir el pedido?' + ); + cy.get('[data-testid="checkoutAddressStep"]').within(() => { + cy.get('label:first').click(); + }); + checkoutNextStep(); + cy.get('[data-testid="checkoutStepper"]').should( + 'contain', + '¿Cómo quieres recibir el pedido?' + ); + cy.get('[data-testid="agencyStepSelect"]').should('exist'); + cy.selectOption('[data-testid="agencyStepSelect"]', 'Other agency'); + checkoutNextStep(); + checkoutNextStep(); + cy.url().should('contain', '/#/ecomerce/catalog'); + cy.get('.q-notification__message:first').should( + 'have.text', + '¡Pedido cargado en la cesta!' + ); }); }); diff --git a/src/test/cypress/support/commands.js b/src/test/cypress/support/commands.js index 00e34c42..5d15cf8f 100644 --- a/src/test/cypress/support/commands.js +++ b/src/test/cypress/support/commands.js @@ -79,3 +79,10 @@ Cypress.Commands.add('changeLanguage', language => { 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 }); + +// Fill Inputs +Cypress.Commands.add('selectOption', (selector, option) => { + cy.waitForElement(selector); + cy.get(selector).click(); + cy.get('.q-menu .q-item').contains(option).click(); +});