Merge branch 'e2e_monitor' of https://gitea.verdnatura.es/verdnatura/salix-front into e2e_monitor
gitea/salix-front/pipeline/pr-dev This commit is unstable Details

This commit is contained in:
Jorge Penadés 2025-03-26 10:44:58 +01:00
commit d2d38c1d3e
9 changed files with 233 additions and 228 deletions

View File

@ -8,14 +8,14 @@ import VnRow from 'src/components/ui/VnRow.vue';
class="q-pa-md"
:style="{ 'flex-direction': $q.screen.lt.lg ? 'column' : 'row', gap: '0px' }"
>
<div style="flex: 0.3">
<div style="flex: 0.3" data-cy="clientsOnWebsite">
<span
class="q-ml-md text-body1"
v-text="$t('salesMonitor.clientsOnWebsite')"
/>
<SalesClientTable />
</div>
<div style="flex: 0.7">
<div style="flex: 0.7" data-cy="recentOrderActions">
<span
class="q-ml-md text-body1"
v-text="$t('salesMonitor.recentOrderActions')"

View File

@ -9,6 +9,7 @@ import { toDateFormat, toDateTimeFormat } from 'src/filters/date.js';
import { toCurrency } from 'src/filters';
import { useVnConfirm } from 'composables/useVnConfirm';
import axios from 'axios';
import VnDateBadge from 'src/components/common/VnDateBadge.vue';
const { t } = useI18n();
const { openConfirmationModal } = useVnConfirm();
@ -164,29 +165,20 @@ const openTab = (id) =>
</div>
</template>
<template #column-dateSend="{ row }">
<QTd>
<QBadge
:color="getBadgeColor(row.date_send)"
text-color="black"
class="q-pa-sm"
style="font-size: 14px"
>
{{ toDateFormat(row.date_send) }}
</QBadge>
</QTd>
<VnDateBadge :date="row.date_send" />
</template>
<template #column-clientFk="{ row }">
<QTd @click.stop>
<span class="link" v-text="row.clientName" :title="row.clientName" />
<div @click.stop.prevent :title="row.clientName">
<span class="link" v-text="row.clientName" />
<CustomerDescriptorProxy :id="row.clientFk" />
</QTd>
</div>
</template>
<template #column-departmentFk="{ row }">
<QTd @click.stop>
<div @click.stop.prevent :title="row.departmentName">
<span class="link" v-text="row.departmentName" />
<DepartmentDescriptorProxy :id="row.departmentFk" dense />
</QTd>
</div>
</template>
</VnTable>
</template>

View File

@ -11,7 +11,7 @@ const $props = defineProps({
</script>
<template>
<QPopupProxy>
<QPopupProxy data-cy="DepartmentDescriptor">
<DepartmentDescriptor
v-if="$props.id"
:id="$props.id"

View File

@ -0,0 +1,53 @@
const clientFk = `[data-cy="recentOrderActions"] [data-cy="column-filter-clientFk"]`;
const departmentFk = `[data-cy="recentOrderActions"] [data-cy="column-filter-departmentFk"]`;
describe('Monitor Clients actions', () => {
beforeEach(() => {
cy.login('developer');
cy.visit('/#/monitor/clients-actions');
cy.waitForElement('.q-page');
cy.intercept('GET', '**/SalesMonitors/ordersFilter*').as('ordersFilter');
cy.intercept('GET', '**/SalesMonitors/clientsFilter*').as('clientsFilter');
});
it('Should load layout', () => {
cy.get('.q-page').should('be.visible');
cy.dataCy('recentOrderActions').within(() => {
cy.firstRow('clientFk').find('span').should('have.class', 'link').click();
});
cy.dataCy('CustomerDescriptor').should('exist');
cy.dataCy('recentOrderActions').within(() => {
cy.firstRow('departmentFk', 2)
.find('span')
.should('have.class', 'link')
.click();
});
cy.dataCy('DepartmentDescriptor').should('exist');
cy.dataCy('clientsOnWebsite')
.find(' .q-ml-md')
.should('have.text', 'Clients on website');
cy.dataCy('recentOrderActions')
.find('.q-ml-md')
.should('have.text', 'Recent order actions');
cy.get('[data-cy="From_inputDate"]').should('have.value', '01/01/2001');
cy.get('[data-cy="To_inputDate"]').should('have.value', '01/01/2001');
cy.get(`${clientFk} [data-cy="_select"]`).click();
cy.clickOption();
cy.countTableRows('eq', 0);
cy.get(`${clientFk} .q-field .q-field__control > :nth-child(2)`).click();
cy.get(`${departmentFk} [data-cy="_select"]`).type('VIP').trigger('enter');
cy.intercept('GET', '**/Departments*').as('filterDepartment');
cy.wait('@filterDepartment').then(() => {
cy.clickOption();
cy.countTableRows('eq', 13);
});
cy.get(`${clientFk} [data-cy="_select"]`).type('Bruce Banner');
cy.intercept('GET', '**/Clients*').as('filterClient');
cy.wait('@filterClient').then(() => {
cy.clickOption();
cy.countTableRows('eq', 3);
});
});
});

View File

@ -4,208 +4,138 @@ const firstRow = (field, index = 1) =>
describe('Monitor Tickets Table', () => {
beforeEach(() => {
cy.login('developer');
cy.viewport(1920, 720);
cy.visit('/#/monitor/tickets');
cy.waitForElement('.q-page');
cy.intercept('GET', '**/SalesMonitors/salesFilter*').as('filterRequest');
cy.openFilterPanel();
});
it('should open new tab when ctrl+click on client link', () => {
cy.intercept('GET', '**/SalesMonitors/salesFilter*').as('filterRequest');
cy.window().then((win) => {
cy.stub(win, 'open').as('windowOpen');
});
cy.get(firstRow('provinceFk')).click({ ctrlKey: true });
cy.get('@windowOpen').should('be.calledWithMatch', /\/ticket\/\d+\/sale/);
});
it.only('should filter by column headers and update URL params', () => {
cy.intercept('GET', '**/SalesMonitors/salesFilter*').as('filterRequest');
cy.dataCy('column-filter-id').find(' [data-cy="_input"]').type('13');
cy.dataCy('column-filter-id').find('[data-cy="_input"]').type('13');
cy.dataCy('column-filter-id').find(' .q-icon').click();
cy.openRightMenu();
cy.dataCy('column-filter-clientFk')
.find('[data-cy="_select"]', { timeout: 3000 })
.type('1101', { timeout: 3000, force: true });
cy.get('[role="listbox"]')
.find('.q-item')
.find('.q-item__label')
.contains('Bruce Wayne')
.click();
cy.get(
'[data-cy="column-filter-clientFk"] > [data-v-532139db=""] > .column > .q-field > .q-field__inner > .q-field__control > :nth-child(2) > .q-icon',
).click();
cy.get(
'[data-cy="column-filter-id"] > [data-v-532139db=""] > .column > [dense="true"] > .q-field > .q-field__inner > .q-field__control > .q-field__control-container > [data-cy="_input"]',
).clear('1');
cy.get(
'[data-cy="column-filter-clientFk"] > [data-v-532139db=""] > .column > .q-field > .q-field__inner > .q-field__control > .q-field__control-container > .q-field__native > [data-cy="_select"]',
).clear('1');
cy.get(
'[data-cy="column-filter-clientFk"] > [data-v-532139db=""] > .column > .q-field > .q-field__inner > .q-field__control > .q-field__control-container > .q-field__native > [data-cy="_select"]',
{ timeout: 3000 },
).type('1101');
cy.get('.q-item__label--caption').click();
cy.get(
'[data-cy="column-filter-salesPersonFk"] > [data-v-532139db=""] > .column > .q-field > .q-field__inner > .q-field__control > .q-field__control-container > .q-field__native > [data-cy="_select"]',
).click();
cy.get(
'#f_0ab28e51-61ef-42fd-98cf-5c145672132a_1 > .q-item__section > :nth-child(1)',
).click();
cy.get(
'[data-cy="column-filter-provinceFk"] > [data-v-532139db=""] > .column > .q-field > .q-field__inner > .q-field__control > .q-field__control-container > .q-field__native > [data-cy="_select"]',
).click();
cy.get('#f_7e2e6ebc-5a8e-40e6-a436-b301a249090e_2 > .q-item__section').click();
cy.get(
'[data-cy="column-filter-state"] > [data-v-532139db=""] > .column > .q-field > .q-field__inner > .q-field__control > .q-field__control-container > .q-field__native > [data-cy="_select"]',
).click();
cy.get('.q-table__top').click();
cy.get(
'[data-cy="column-filter-state"] > [data-v-532139db=""] > .column > .q-field > .q-field__inner > .q-field__control > .q-field__control-container > .q-field__native > [data-cy="_select"]',
).click();
cy.get(
'#f_e05db3bc-1bae-4398-8e06-a9395e8f9e30_13 > .q-item__section > :nth-child(1)',
).click();
cy.get('.q-ml-sm > .q-btn__content > .q-icon').click();
/* ==== End Cypress Studio ==== */
});
describe('should filter by filter panel', () => {
it('clientFk', () => {
// Client id - clientFk
cy.get('[data-cy="Client id_input"]').type('1101');
cy.searchInFilterPanel();
requestParams('clientFk', '1101');
countRows('eq', 7);
});
it('orderFk', () => {
// order id
cy.get('[data-cy="Order id_input"]').type(7);
cy.searchInFilterPanel();
requestParams('orderFk', '7');
countRows('eq', 1);
});
it('scopeDays', () => {
// Scope days
cy.get('[data-cy="Days onward_input"]').type(2);
cy.searchInFilterPanel();
requestParams('scopeDays', '2');
countRows('eq', 27);
});
it('salesPersonFk', () => {
// SalesPerson
cy.get('[data-cy="vnWorkerSelect"]').click();
cy.get('.q-item__label').contains('salesPersonNick').click();
cy.searchInFilterPanel();
requestParams('c.salesPersonFk', 18, { inWhere: true });
countRows('eq', 21);
});
// it('', () => {
// cy.get('.q-mt-xs > .q-item__section--side').click();
// requestParams(null);
// });
it('nickname', () => {
// Nickname
cy.get('[data-cy="Nickname_input"]').type('test');
cy.searchInFilterPanel();
requestParams('t.nickname', 'test', { inWhere: true, like: true });
countRows('eq', 2);
});
it('refFk', () => {
// Invoice
cy.get('[data-cy="Invoice_input"]').type('test');
cy.searchInFilterPanel();
requestParams('refFk', 'test');
countRows('eq', 0);
});
it('agencyModeFk', () => {
// Agency
cy.get('[data-cy="Agency_select"]').click();
cy.get('.q-item__label').contains('inhouse pickup').click();
cy.searchInFilterPanel();
requestParams('agencyModeFk', '1');
countRows('eq', 6);
});
// it('', () => {
// cy.get('.q-mt-xs > .q-item__section--side').click();
// requestParams(null);
// });
it('state', () => {
// State
cy.get('[data-cy="State_select"]').click();
cy.get('.q-item__label').contains('Libre').click();
cy.searchInFilterPanel();
requestParams('ts.stateFk', 2, { inWhere: true });
countRows('eq', 11);
});
it('alertLevel', () => {
// AlertLevel
cy.get('[data-cy="Grouped State_select"]').click();
cy.get('.q-item__label').contains('Free').click();
cy.searchInFilterPanel();
requestParams('alertLevel', '0');
countRows('eq', 16);
});
// it('', () => {
// cy.get('.q-mt-xs > .q-item__section--side').click();
// requestParams(null);
// });
it('countryFk', () => {
// Country
cy.get('[data-cy="Country_select"]').click();
cy.get('.q-item__label').contains('España').click();
cy.searchInFilterPanel();
requestParams('countryFk', '1');
countRows('eq', 26);
});
it('warehouseFk', () => {
// Province
cy.get('[data-cy="Province_select"]').click();
cy.get('.q-item__label').contains('Province one').click();
cy.searchInFilterPanel();
requestParams('warehouseFk', 1);
countRows('eq', 2);
});
it('department', () => {
// Department
cy.get('[data-cy="Department_select"]').click();
cy.get('.q-item__label').contains('VENTAS').click();
cy.searchInFilterPanel();
requestParams('d.name', 'VENTAS', { inWhere: true });
countRows('eq', 24);
});
it('packing', () => {
// ITP
cy.get('[data-cy="ITP_select"]').click();
cy.get('.q-item__label').contains('H').click();
cy.searchInFilterPanel();
requestParams('packing', 'H');
countRows('eq', 5);
cy.dataCy('column-filter-clientFk').find('[data-cy="_select"]').type('1101');
cy.intercept('GET', '**/Clients*').as('filterClient');
cy.wait('@filterClient').then(() => {
cy.clickOption();
});
});
it('should filter by filter panel', () => {
// Client id - clientFk
cy.get('[data-cy="Client id_input"]').type('1101');
cy.searchInFilterPanel();
cy.url().should('include', 'clientFk');
cy.countTableRows('eq', 7);
//
cy.cleanFilterPanel();
cy.get('[data-cy="Order id_input"]').type(7);
cy.searchInFilterPanel();
cy.url().should('include', 'orderFk');
cy.countTableRows('eq', 1);
//
cy.cleanFilterPanel();
cy.get('[data-cy="Days onward_input"]').type(2);
cy.searchInFilterPanel();
cy.url().should('include', 'scopeDays');
cy.countTableRows('eq', 27);
//
cy.cleanFilterPanel();
// Nickname
cy.get('[data-cy="Nickname_input"]').type('test');
cy.searchInFilterPanel();
cy.url().should('include', 'nickname');
cy.countTableRows('eq', 2);
//
cy.cleanFilterPanel();
// Invoice
cy.get('[data-cy="Invoice_input"]').type('test');
cy.searchInFilterPanel();
cy.url().should('include', 'refFk');
cy.countTableRows('eq', 0);
//
cy.cleanFilterPanel();
// Agency
cy.get('[data-cy="Agency_select"]').click();
cy.get('.q-item__label').contains('inhouse pickup').click();
cy.searchInFilterPanel();
cy.url().should('include', 'agencyModeFk');
cy.countTableRows('eq', 6);
//
cy.cleanFilterPanel();
// State
cy.get('[data-cy="State_select"]').click();
cy.get('.q-item__label').contains('Libre').click();
cy.searchInFilterPanel();
cy.url().should('include', 'stateFk');
cy.countTableRows('eq', 13);
//
cy.cleanFilterPanel();
// AlertLevel
cy.get('[data-cy="Grouped State_select"]').click();
cy.get('.q-item__label').contains('Free').click();
cy.searchInFilterPanel();
cy.url().should('include', 'alertLevel');
cy.countTableRows('eq', 18);
//
cy.cleanFilterPanel();
// Country
cy.get('[data-cy="Country_select"]').click();
cy.get('.q-item__label').contains('España').click();
cy.searchInFilterPanel();
cy.url().should('include', 'countryFk');
cy.countTableRows('eq', 28);
//
cy.cleanFilterPanel();
// Province
cy.get('[data-cy="Warehouse_select"]').click();
cy.get('.q-item__label').contains('Warehouse Two').click();
cy.searchInFilterPanel();
cy.url().should('include', 'warehouseFk');
cy.countTableRows('eq', 1);
//
cy.cleanFilterPanel();
// Department
cy.selectOption('[data-cy="Department_select"]', 'EQUIPO ESPAÑA LEVANTE');
cy.searchInFilterPanel();
cy.url().should('include', 'departmentFk');
//
cy.cleanFilterPanel();
// ITP
cy.get('[data-cy="ITP_select"]').click();
cy.get('.q-item__label').contains('H').click();
cy.searchInFilterPanel();
cy.url().should('include', 'packing');
cy.countTableRows('eq', 5);
});
it('Cols', () => {
cy.get(firstRow('totalProblems'));
cy.get(firstRow('id')).find('span').should('have.class', 'link').click();
cy.dataCy('TicketDescriptor').should('exist');
cy.get(firstRow('zoneFk')).find('span').should('have.class', 'link').click();
cy.dataCy('ZoneDescriptor').should('exist');
cy.get(firstRow('clientFk')).find('span').should('have.class', 'link').click();
cy.dataCy('CustomerDescriptor').should('exist');
cy.get(firstRow('salesPersonFk'))
cy.get(firstRow('departmentFk'))
.find('span')
.should('have.class', 'link')
.click();
cy.dataCy('WorkerDescriptor').should('exist');
cy.get(firstRow('zoneFk')).find('span').should('have.class', 'link').click();
cy.dataCy('ZoneDescriptor').should('exist');
cy.dataCy('DepartmentDescriptor').should('exist');
cy.get(firstRow('shippedDate')).find('.q-badge');
cy.get(
':nth-child(1) > .q-table--col-auto-width > [data-cy="tableAction-0"] > .q-btn__content > .q-icon',
@ -215,37 +145,32 @@ describe('Monitor Tickets Table', () => {
).click();
cy.get('.summaryHeader').should('exist');
});
it('clear scopeDays', function () {
cy.get('[data-cy="Days onward_input"]').clear().type('2');
cy.searchInFilterPanel();
cy.get('.q-chip__content > span').should('have.text', '"2"');
cy.waitSpinner();
checkScopeDays(2);
cy.get('[data-cy="Days onward_input"]').clear();
cy.searchInFilterPanel();
cy.get('.q-chip__content > span').should('have.text', '"0"');
cy.waitSpinner();
checkScopeDays(0);
});
});
function requestParams(key, value, options = { inWhere: false, like: false }) {
cy.wait('@filterRequest').then((interception) => {
if (!key) return;
const { query } = interception.request;
if (!options.inWhere) expect(query).to.have.property(key, value);
else {
const filter = JSON.parse(query.filter);
if (options.like)
expect(filter.where).to.have.deep.property(key, {
like: `%${value}%`,
});
else {
expect(filter).to.have.property('where');
expect(filter.where).to.have.property(key, value);
}
}
});
}
function countRows(operator = 'gt', value = 0) {
const element = 'data-row-index';
cy.get('body').then(($body) => {
const hasRows = $body.find(`td[${element}]`).length > 0;
if (!hasRows) expect(0).to.be[operator](value);
else
cy.get(`td[${element}]`)
.last()
.invoke('attr', element)
.then((lastIndex) => {
const totalRows = parseInt(lastIndex) + 1;
expect(totalRows).to.be[operator](value);
});
function checkScopeDays(scopeDays) {
cy.url().then((url) => {
const urlParams = new URLSearchParams(url.split('?')[1]);
const saleMonitorTickets = JSON.parse(
decodeURIComponent(urlParams.get('saleMonitorTickets')),
);
expect(saleMonitorTickets.scopeDays).to.equal(scopeDays);
const fromDate = new Date(saleMonitorTickets.from);
const toDate = new Date(saleMonitorTickets.to);
expect(toDate.getDate() - fromDate.getDate()).to.equal(
saleMonitorTickets.scopeDays,
);
});
}

View File

@ -0,0 +1,3 @@
Cypress.Commands.add('clickOption', (index = 1) =>
cy.get(`.q-menu :nth-child(${index}) >.q-item__section`).click(),
);

View File

@ -0,0 +1,3 @@
Cypress.Commands.add('firstRow', (field, index = 1) =>
cy.get(`:nth-child(${index}) > [data-col-field="${field}"]`),
);

View File

@ -29,7 +29,12 @@
// import { registerCommands } from '@quasar/quasar-app-extension-testing-e2e-cypress';
import moment from 'moment';
import waitUntil from './waitUntil';
// Importar dinámicamente todos los archivos con el sufijo .commands.js dentro de la carpeta src/test/cypress/integration
const requireCommands = require.context('../integration', true, /\.commands\.js$/);
// Iterar sobre cada archivo y requerirlo
requireCommands.keys().forEach(requireCommands);
// Common comma
Cypress.Commands.add('waitUntil', { prevSubject: 'optional' }, waitUntil);
Cypress.Commands.add('resetDB', () => {
@ -102,6 +107,13 @@ Cypress.Commands.add('waitSpinner', () => {
}
});
});
// Cypress.Commands.add('waitRightSpinner', () => {
// cy.get('body').then(($body) => {
// if ($body.find('.q-inner-loading').length) {
// cy.get('.q-inner-loading').should('not.be.visible');
// }
// });
// });
// Fill Inputs
Cypress.Commands.add('selectOption', (selector, option, timeout = 2500) => {
@ -354,6 +366,7 @@ Cypress.Commands.add('openRightMenu', (element) => {
Cypress.Commands.add('cleanFilterPanel', () => {
const element = 'clearFilters';
cy.get('#filterPanelForm').scrollIntoView();
if (element) cy.waitForElement(`[data-cy="${element}"]`);
cy.dataCy(element).click();
});
@ -625,3 +638,18 @@ Cypress.Commands.add('checkQueryParams', (expectedParams = {}) => {
Cypress.Commands.add('waitTableScrollLoad', () =>
cy.waitForElement('[data-q-vs-anchor]'),
);
Cypress.Commands.add('countTableRows', (operator = 'gt', value = 0) => {
const element = 'data-row-index';
cy.get('body').then(($body) => {
const hasRows = $body.find(`td[${element}]`).length > 0;
if (!hasRows) expect(0).to.be[operator](value);
else
cy.get(`td[${element}]`)
.last()
.invoke('attr', element)
.then((lastIndex) => {
const totalRows = parseInt(lastIndex) + 1;
expect(totalRows).to.be[operator](value);
});
});
});

View File

@ -68,6 +68,7 @@ const waitForApiReady = (url, maxRetries = 20, delay = 1000) => {
};
before(() => {
cy.viewport(1920, 720);
waitForApiReady('/api/Applications/status');
});