diff --git a/src/components/common/VnAccountNumber.vue b/src/components/common/VnAccountNumber.vue index c4fa78674..56add7329 100644 --- a/src/components/common/VnAccountNumber.vue +++ b/src/components/common/VnAccountNumber.vue @@ -1,12 +1,9 @@ - diff --git a/src/components/common/VnInput.vue b/src/components/common/VnInput.vue index aeb4a31fd..9e13f5351 100644 --- a/src/components/common/VnInput.vue +++ b/src/components/common/VnInput.vue @@ -83,7 +83,7 @@ const mixinRules = [ requiredFieldRule, ...($attrs.rules ?? []), (val) => { - const { maxlength } = vnInputRef.value; + const maxlength = $props.maxlength; if (maxlength && +val.length > maxlength) return t(`maxLength`, { value: maxlength }); const { min, max } = vnInputRef.value.$attrs; @@ -108,7 +108,7 @@ const handleInsertMode = (e) => { e.preventDefault(); const input = e.target; const cursorPos = input.selectionStart; - const { maxlength } = vnInputRef.value; + const maxlength = $props.maxlength; let currentValue = value.value; if (!currentValue) currentValue = e.key; const newValue = e.key; @@ -143,7 +143,7 @@ const handleUppercase = () => { :rules="mixinRules" :lazy-rules="true" hide-bottom-space - :data-cy="$attrs.dataCy ?? $attrs.label + '_input'" + :data-cy="$attrs['data-cy'] ?? $attrs.label + '_input'" > diff --git a/test/cypress/integration/vnComponent/VnAccountNumber.spec.js b/test/cypress/integration/vnComponent/VnAccountNumber.spec.js index 63ab646fe..0dc12205b 100644 --- a/test/cypress/integration/vnComponent/VnAccountNumber.spec.js +++ b/test/cypress/integration/vnComponent/VnAccountNumber.spec.js @@ -1,35 +1,50 @@ -describe('VnInput Component', () => { +describe('VnAccountNumber', () => { beforeEach(() => { cy.login('developer'); cy.viewport(1920, 1080); cy.visit('/#/supplier/1/fiscal-data'); }); - it('should replace character at cursor position in insert mode', () => { - // Simula escribir en el input - cy.dataCy('supplierFiscalDataAccount').clear(); - cy.dataCy('supplierFiscalDataAccount').type('4100000001'); - // Coloca el cursor en la posición 0 - cy.dataCy('supplierFiscalDataAccount').type('{movetostart}'); - // Escribe un número y verifica que se reemplace correctamente - cy.dataCy('supplierFiscalDataAccount').type('999'); - cy.dataCy('supplierFiscalDataAccount').should('have.value', '9990000001'); + describe('VnInput handleInsertMode()', () => { + it('should replace character at cursor position in insert mode', () => { + cy.get('input[data-cy="supplierFiscalDataAccount"]').type( + '{selectall}4100000001', + ); + cy.get('input[data-cy="supplierFiscalDataAccount"]').type('{movetostart}'); + cy.get('input[data-cy="supplierFiscalDataAccount"]').type('999'); + cy.get('input[data-cy="supplierFiscalDataAccount"]').should( + 'have.value', + '9990000001', + ); + }); + + it('should replace character at cursor position in insert mode', () => { + cy.get('input[data-cy="supplierFiscalDataAccount"]').clear(); + cy.get('input[data-cy="supplierFiscalDataAccount"]').type('4100000001'); + cy.get('input[data-cy="supplierFiscalDataAccount"]').type('{movetostart}'); + cy.get('input[data-cy="supplierFiscalDataAccount"]').type('999'); + cy.get('input[data-cy="supplierFiscalDataAccount"]').should( + 'have.value', + '9990000001', + ); + }); + + it('should respect maxlength prop', () => { + cy.get('input[data-cy="supplierFiscalDataAccount"]').clear(); + cy.get('input[data-cy="supplierFiscalDataAccount"]').type('123456789012345'); + cy.get('input[data-cy="supplierFiscalDataAccount"]').should( + 'have.value', + '1234567890', + ); + }); }); - it('should replace character at cursor position in insert mode', () => { - // Simula escribir en el input - cy.dataCy('supplierFiscalDataAccount').clear(); - cy.dataCy('supplierFiscalDataAccount').type('4100000001'); - // Coloca el cursor en la posición 0 - cy.dataCy('supplierFiscalDataAccount').type('{movetostart}'); - // Escribe un número y verifica que se reemplace correctamente en la posicion incial - cy.dataCy('supplierFiscalDataAccount').type('999'); - cy.dataCy('supplierFiscalDataAccount').should('have.value', '9990000001'); - }); - - it('should respect maxlength prop', () => { - cy.dataCy('supplierFiscalDataAccount').clear(); - cy.dataCy('supplierFiscalDataAccount').type('123456789012345'); - cy.dataCy('supplierFiscalDataAccount').should('have.value', '1234567890'); // asumiendo que maxlength es 10 + it('should convert short account number to standard format', () => { + cy.get('input[data-cy="supplierFiscalDataAccount"]').clear(); + cy.get('input[data-cy="supplierFiscalDataAccount"]').type('123.'); + cy.get('input[data-cy="supplierFiscalDataAccount"]').should( + 'have.value', + '1230000000', + ); }); });