salix-front/test/cypress/support/commands.js

597 lines
20 KiB
JavaScript
Executable File

// ***********************************************
// This example commands.js shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
//
//
// -- This is a parent command --
// Cypress.Commands.add("login", (email, password) => { ... })
//
//
// -- This is a child command --
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This is will overwrite an existing command --
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
// DO NOT REMOVE
// Imports Quasar Cypress AE predefined commands
// import { registerCommands } from '@quasar/quasar-app-extension-testing-e2e-cypress';
import moment from 'moment';
import waitUntil from './waitUntil';
Cypress.Commands.add('waitUntil', { prevSubject: 'optional' }, waitUntil);
Cypress.Commands.add('resetDB', () => {
cy.exec('pnpm run resetDatabase');
});
Cypress.Commands.add('login', (user = 'developer') => {
//cy.visit('/#/login');
cy.request({
method: 'POST',
url: '/api/accounts/login',
body: {
user: 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.overwrite('visit', (originalFn, url, options, waitRequest = true) => {
originalFn(url, options);
cy.waitUntil(() => cy.document().then((doc) => doc.readyState === 'complete'));
cy.waitUntil(() => cy.get('main').should('exist'));
if (waitRequest) cy.waitSpinner();
});
Cypress.Commands.add('waitForElement', (element) => {
cy.get(element).should('be.visible').and('not.be.disabled');
});
Cypress.Commands.add('getValue', (selector) => {
cy.get(selector).then(($el) => {
if ($el.find('.q-checkbox__inner').length > 0) {
return cy.get(selector + '.q-checkbox__inner');
}
// Si es un QSelect
if ($el.find('.q-select__dropdown-icon').length) {
return cy
.get(
selector +
'> .q-field > .q-field__inner > .q-field__control > .q-field__control-container > .q-field__native > input',
)
.invoke('val');
}
// Si es un QSelect
if ($el.find('span').length) {
return cy.get(selector + ' span').then(($span) => {
return $span[0].innerText;
});
}
// Puedes añadir un log o lanzar un error si el elemento no es reconocido
cy.log('Elemento no soportado');
});
});
Cypress.Commands.add('waitSpinner', () => {
cy.get('body').then(($body) => {
if ($body.find('[data-cy="loading-spinner"]').length) {
cy.get('[data-cy="loading-spinner"]').should('not.be.visible');
}
});
});
// Fill Inputs
Cypress.Commands.add('selectOption', (selector, option, timeout = 2500) => {
cy.waitForElement(selector, timeout);
cy.get(selector, { timeout })
.should('exist')
.should('be.visible')
.click()
.then(($el) => {
cy.wrap($el.is('input') ? $el : $el.find('input'))
.invoke('attr', 'aria-controls')
.then((ariaControl) => selectItem(selector, option, ariaControl));
});
});
function selectItem(selector, option, ariaControl, hasWrite = true) {
if (!hasWrite) cy.wait(100);
cy.waitSpinner();
getItems(ariaControl).then((items) => {
const matchingItem = items.toArray().find((item) => {
const val = typeof option == 'string' ? option.toLowerCase() : option;
return item.innerText.toLowerCase().includes(val);
});
if (matchingItem) return cy.wrap(matchingItem).click();
if (hasWrite) cy.get(selector).clear().type(option);
return selectItem(selector, option, ariaControl, false);
});
}
function getItems(ariaControl, startTime = Cypress._.now(), timeout = 2500) {
// Se intenta obtener la lista de opciones del desplegable de manera recursiva
return cy
.get('#' + ariaControl, { timeout })
.should('exist')
.find('.q-item')
.should('exist')
.should('be.visible')
.then(($items) => {
if (!$items?.length || $items.first().text().trim() === '') {
if (Cypress._.now() - startTime > timeout) {
throw new Error(
`getItems: Tiempo de espera (${timeout}ms) excedido.`,
);
}
return getItems(ariaControl, startTime, timeout);
}
return cy.wrap($items);
});
}
Cypress.Commands.add('countSelectOptions', (selector, option) => {
cy.waitForElement(selector);
cy.get(selector).click({ force: true });
cy.get('.q-menu .q-item').should('have.length', option);
});
Cypress.Commands.add('fillInForm', (obj, opts = {}) => {
cy.waitSpinner();
const { form = '.q-form > .q-card', attr = 'aria-label' } = opts;
cy.waitForElement(form);
cy.get(`${form} input`).each(([el]) => {
cy.wrap(el)
.invoke('attr', attr)
.then((key) => {
const field = obj[key];
if (!field) return;
if (typeof field == 'string')
return cy
.wrap(el)
.type(`{selectall}{backspace}${field}`, { delay: 0 });
const { type, val } = field;
switch (type) {
case 'select':
cy.selectOption(el, val);
break;
case 'date':
cy.get(el).type(
`{selectall}{backspace}${val.split('-').join('')}`,
);
break;
case 'time':
cy.get(el).click();
cy.get('.q-time .q-time__clock').contains(val.h).click();
cy.get('.q-time .q-time__clock').contains(val.m).click();
cy.get('.q-time .q-time__link').contains(val.x).click();
break;
default:
cy.wrap(el).type(`{selectall}${val}`, { delay: 0 });
break;
}
});
});
});
Cypress.Commands.add('validateForm', (obj, opts = {}) => {
const { form = '.q-form > .q-card', attr = 'data-cy' } = opts;
cy.waitForElement(form);
cy.get(`${form} input`).each(([el]) => {
cy.wrap(el)
.invoke('attr', attr)
.then((key) => {
const field = obj[key];
if (!field) return;
const { type, val } = field;
cy.get(el)
.invoke('val')
.then((elVal) => {
if (typeof field == 'string')
expect(elVal.toLowerCase()).to.equal(field.toLowerCase());
else
switch (type) {
case 'date':
const elDate = moment(elVal, 'DD-MM-YYYY');
const mockDate = moment(val, 'DD-MM-YYYY');
expect(elDate.isSame(mockDate, 'day')).to.be.true;
break;
default:
expect(elVal.toLowerCase()).to.equal(
val.toLowerCase(),
);
break;
}
});
});
});
});
Cypress.Commands.add('checkOption', (selector) => {
cy.get(selector).find('.q-checkbox__inner').click();
});
// Global buttons
Cypress.Commands.add('saveCard', () => {
const dropdownArrow = '.q-btn-dropdown__arrow-container > .q-btn__content > .q-icon';
cy.get('#st-actions').then(($el) => {
if ($el.find(dropdownArrow).length) cy.get(dropdownArrow).click();
});
cy.get('[title="Save"]').click();
});
Cypress.Commands.add('resetCard', () => {
cy.get('[title="Reset"]').click();
});
Cypress.Commands.add('removeCard', () => {
cy.get('[title="Remove"]').click();
});
Cypress.Commands.add('addCard', () => {
cy.waitForElement('tbody');
cy.waitForElement('.q-page-sticky > div > .q-btn');
cy.get('.q-page-sticky > div > .q-btn').click();
});
Cypress.Commands.add('clickConfirm', () => {
cy.waitForElement('.q-dialog__inner > .q-card');
cy.get('.q-card__actions > .q-btn--unelevated > .q-btn__content > .block').click();
});
Cypress.Commands.add('notificationHas', (selector, text) => {
cy.get(selector).should('have.text', text);
});
Cypress.Commands.add('selectRows', (rows) => {
rows.forEach((row) => {
cy.get('.q-table .q-virtual-scroll__content tr .q-checkbox__inner')
.eq(row - 1)
.click();
});
});
Cypress.Commands.add('fillRow', (rowSelector, data) => {
// Usar el selector proporcionado para obtener la fila deseada
cy.waitForElement('tbody');
cy.get(rowSelector).as('currentRow');
data.forEach((value, index) => {
if (value === null) return;
cy.get('@currentRow')
.find('td')
.eq(index)
.then((td) => {
if (td.find('.q-select__dropdown-icon').length) {
cy.selectOption(td, value);
} else if (td.find('.q-checkbox__inner').length && value) {
cy.checkOption(td);
} else if (td.find('input[type="text"]') && value)
cy.get(td).find('input').type(value);
});
});
});
Cypress.Commands.add('addRow', () => {
cy.waitForElement('tbody');
cy.get('.q-page-sticky > div > .q-btn > .q-btn__content').click();
});
Cypress.Commands.add('validateRow', (rowSelector, expectedValues) => {
cy.waitForElement('tbody');
cy.get(rowSelector).within(() => {
for (const [index, value] of expectedValues.entries()) {
cy.log('CHECKING ', index, value);
if (value === undefined) continue;
if (typeof value == 'boolean') {
const prefix = value ? '' : 'not.';
cy.getValue(`:nth-child(${index + 1})`).should(`${prefix}be.checked`);
continue;
}
cy.getValue(`:nth-child(${index + 1})`).should('equal', value);
}
});
});
Cypress.Commands.add('removeRow', (rowIndex) => {
const trEls = 'tbody > tr:visible';
let rowsBefore;
cy.get('tbody > tr')
.its('length')
.then((length) => {
cy.get(`${trEls} .q-checkbox`)
.eq(rowIndex - 1)
.click();
cy.removeCard();
cy.get('.q-dialog button').eq(2).click();
rowsBefore = length;
})
.then(() => {
// Check the existence of tbody before performing the second assertion.
cy.get('tbody').then(($tbody) => {
if ($tbody.length > 0)
cy.get('tbody > tr').should('have.length', rowsBefore - 1);
});
});
});
Cypress.Commands.add('openListSummary', (row) => {
cy.get('.card-list-body .actions .q-btn:nth-child(2)').eq(row).click();
});
Cypress.Commands.add('openRightMenu', (element) => {
if (element) cy.waitForElement(element);
cy.get('[data-cy="toggle-right-drawer"]').click();
});
Cypress.Commands.add('openLeftMenu', (element) => {
if (element) cy.waitForElement(element);
cy.get('.q-toolbar > .q-btn--round.q-btn--dense > .q-btn__content > .q-icon').click();
});
Cypress.Commands.add('clearSearchbar', (element) => {
if (element) cy.waitForElement(element);
cy.get('[data-cy="vn-searchbar"]').clear();
});
Cypress.Commands.add('typeSearchbar', (value) => {
cy.get('[data-cy="vn-searchbar"]').type(value);
});
Cypress.Commands.add('validateContent', (selector, expectedValue) => {
cy.get(selector).should('have.text', expectedValue);
});
Cypress.Commands.add('openActionsDescriptor', () => {
cy.get('[data-cy="cardDescriptor"] [data-cy="descriptor-more-opts"]').click();
});
Cypress.Commands.add('openUserPanel', () => {
cy.dataCy('userPanel_btn').click();
});
Cypress.Commands.add('checkNotification', (text) => {
cy.get('.q-notification')
.should('be.visible')
.should('have.length.greaterThan', 0)
.should(($elements) => {
const found = $elements
.toArray()
.some((el) => Cypress.$(el).text().includes(text));
expect(found).to.be.true;
});
});
Cypress.Commands.add('openActions', (row) => {
cy.get('tbody > tr').eq(row).find('.actions > .q-btn').click();
});
Cypress.Commands.add('checkValueForm', (id, search) => {
cy.get(`.grid-create > :nth-child(${id}) `)
.find('input')
.should('have.value', search);
});
Cypress.Commands.add('checkValueSelectForm', (id, search) => {
cy.get(
`.grid-create > :nth-child(${id}) > .q-field > .q-field__inner > .q-field__control > .q-field__control-container > .q-field__native > .q-field__input`,
).should('have.value', search);
});
Cypress.Commands.add('searchByLabel', (label, value) => {
cy.get(`[label="${label}"] > .q-field > .q-field__inner`).type(`${value}{enter}`);
});
Cypress.Commands.add('dataCy', (tag, attr = 'data-cy') => {
return cy.get(`[${attr}="${tag}"]`);
});
Cypress.Commands.add('addBtnClick', () => {
cy.get('.q-page-sticky > div > .q-btn > .q-btn__content > .q-icon')
.should('exist')
.and('be.visible')
.click();
});
Cypress.Commands.add('clickButtonWith', (type, value) => {
switch (type) {
case 'icon':
cy.clickButtonWithIcon(value);
break;
default:
cy.clickButtonWithText(value);
break;
}
});
Cypress.Commands.add('clickButtonWithIcon', (iconClass) => {
cy.waitForElement('[data-cy="descriptor_actions"]');
cy.get('[data-cy="loading-spinner"]', { timeout: 10000 }).should('not.be.visible');
cy.get('.q-btn')
.filter((index, el) => Cypress.$(el).find('.q-icon.' + iconClass).length > 0)
.then(($btn) => {
cy.wrap($btn).click();
});
});
Cypress.Commands.add('clickButtonWithText', (buttonText) => {
cy.get('.q-btn').contains(buttonText).click();
});
Cypress.Commands.add('getOption', (index = 1) => {
cy.waitForElement('[role="listbox"]');
cy.get(`[role="listbox"] .q-item:nth-child(${index})`).click();
});
Cypress.Commands.add('searchBtnFilterPanel', () => {
cy.get(
'.q-scrollarea__content > .q-btn--standard > .q-btn__content > .q-icon',
).click();
});
Cypress.Commands.add('waitRequest', (alias, cb) => {
cy.wait(alias).then(cb);
});
Cypress.Commands.add('validateDescriptor', (toCheck = {}) => {
const { title, description, subtitle, listbox = {}, popup = false } = toCheck;
const popupSelector = popup ? '[role="menu"] ' : '';
if (title) cy.get(`${popupSelector}[data-cy="cardDescriptor_title"]`).contains(title);
if (description)
cy.get(`${popupSelector}[data-cy="cardDescriptor_description"]`).contains(
description,
);
if (subtitle)
cy.get(`${popupSelector}[data-cy="cardDescriptor_subtitle"]`).contains(subtitle);
for (const index in listbox)
cy.get(`${popupSelector}[data-cy="cardDescriptor_listbox"] > *`)
.eq(index)
.should('contain.text', listbox[index]);
});
Cypress.Commands.add('validateVnTableRows', (opts = {}) => {
let { cols = [], rows = [] } = opts;
if (!Array.isArray(cols)) cols = [cols];
const rowSelector = rows.length
? rows.map((row) => `> :nth-child(${row})`).join(', ')
: '> *';
cy.get(`[data-cy="vnTable"] .q-virtual-scroll__content`).within(() => {
cy.get(`${rowSelector}`).each(($el) => {
for (const { name, type = 'string', val, operation = 'equal' } of cols) {
cy.wrap($el)
.find(`[data-cy="vnTableCell_${name}"]`)
.invoke('text')
.then((text) => {
if (type === 'string')
expect(text.trim().toLowerCase()).to[operation](
val.toLowerCase(),
);
if (type === 'number') cy.checkNumber(text, val, operation);
if (type === 'date') cy.checkDate(text, val, operation);
});
}
});
});
});
Cypress.Commands.add('checkDate', (rawDate, expectedVal, operation) => {
const date = moment(rawDate.trim(), 'MM/DD/YYYY');
const compareDate = moment(expectedVal, 'DD/MM/YYYY');
switch (operation) {
case 'equal':
expect(text.trim()).to.equal(compareDate);
break;
case 'before':
expect(date.isBefore(compareDate)).to.be.true;
break;
case 'after':
expect(date.isAfter(compareDate)).to.be.true;
}
});
Cypress.Commands.add('selectDescriptorOption', (opt = 1) => {
const listItem = '[data-cy="descriptor-more-opts_list"]';
cy.get('body').then(($body) => {
if (!$body.find(listItem).length) cy.openActionsDescriptor();
});
cy.waitForElement(listItem);
cy.get(`${listItem} > :not(template):nth-of-type(${opt})`).click();
});
Cypress.Commands.add('validateCheckbox', (selector, expectedVal = 'true') => {
cy.get(selector).should('have.attr', 'aria-checked', expectedVal.toString());
});
Cypress.Commands.add('validateDownload', (trigger, opts = {}) => {
const {
url = /api\/dms\/\d+\/downloadFile\?access_token=.+/,
types = ['text/plain', 'image/jpeg'],
alias = 'download',
} = opts;
cy.intercept('GET', url).as(alias);
trigger().then(() => {
cy.wait(`@${alias}`).then(({ response }) => {
expect(response.statusCode).to.equal(200);
const isValidType = types.some((type) =>
response.headers['content-type'].includes(type),
);
expect(isValidType).to.be.true;
});
});
});
Cypress.Commands.add('validatePdfDownload', (match, trigger) => {
cy.window().then((win) => {
cy.stub(win, 'open')
.callsFake(() => null)
.as('pdf');
});
trigger();
cy.get('@pdf')
.should('be.calledOnce')
.then((stub) => {
const [url] = stub.getCall(0).args;
expect(url).to.match(match);
cy.request(url).then((response) =>
expect(response.headers['content-type']).to.include('application/pdf'),
);
});
});
Cypress.Commands.add('clicDescriptorAction', (index = 1) => {
cy.get(`[data-cy="descriptor_actions"] .q-btn:nth-of-type(${index})`).click();
});
Cypress.Commands.add('checkQueryParams', (expectedParams = {}) => {
cy.url().then((url) => {
const urlParams = new URLSearchParams(url.split('?')[1]);
for (const key in expectedParams) {
const expected = expectedParams[key];
const param = JSON.parse(decodeURIComponent(urlParams.get(key)));
if (typeof expected === 'object') {
const { subkey, val } = expected;
expect(param[subkey]).to.equal(val);
} else expect(param).to.equal(expected);
}
});
});
Cypress.Commands.add('waitTableScrollLoad', () =>
cy.waitForElement('[data-q-vs-anchor]'),
);