From eb34994d21bb049efa36f23ced56eda354ba3f0d Mon Sep 17 00:00:00 2001 From: Andrey Belokopytov Date: Sat, 23 Nov 2024 14:53:05 +0300 Subject: [PATCH 1/6] fix: fix adding unnecessary symbols in postfix-postprocessor --- .../number/mirrored-value-postfix.cy.ts | 34 +++++++++++++++++++ .../lib/processors/postfix-postprocessor.ts | 1 + 2 files changed, 35 insertions(+) create mode 100644 projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts diff --git a/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts b/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts new file mode 100644 index 000000000..975f2f19b --- /dev/null +++ b/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts @@ -0,0 +1,34 @@ +import {maskitoNumberOptionsGenerator} from '@maskito/kit'; + +import {TestInput} from '../utils'; + +describe('Number | [postfix]=" EUR" (no initial value & no caret guard)', () => { + beforeEach(() => { + cy.mount(TestInput, { + componentProperties: { + initialValue: '', + maskitoOptions: maskitoNumberOptionsGenerator({ + postfix: ' EUR', + precision: 2, + }), + }, + }); + cy.get('input').focus().should('have.value', '').as('input'); + }); + + it('Empty input => Paste "11.22 " => Textfield\'s value is "11.22 EUR"', () => { + cy.get('input') + .paste('11.22 ') + .should('have.value', '11.22 EUR') + .should('have.prop', 'selectionStart', '11.22 '.length) + .should('have.prop', 'selectionEnd', '11.22 '.length); + }); + + it('Empty input => Paste "11.22 " => Textfield\'s value is "11.22 EUR"', () => { + cy.get('input') + .paste('11.22 ') + .should('have.value', '11.22 EUR') + .should('have.prop', 'selectionStart', '11.22 '.length) + .should('have.prop', 'selectionEnd', '11.22 '.length); + }); +}); diff --git a/projects/kit/src/lib/processors/postfix-postprocessor.ts b/projects/kit/src/lib/processors/postfix-postprocessor.ts index 4595d8f0f..c3f378075 100644 --- a/projects/kit/src/lib/processors/postfix-postprocessor.ts +++ b/projects/kit/src/lib/processors/postfix-postprocessor.ts @@ -26,6 +26,7 @@ export function maskitoPostfixPostprocessorGenerator( '', ); const postfixWasModified = + !value.endsWith(postfix) && initialElementState.selection[1] >= initialValueBeforePostfix.length; const alreadyExistedValueBeforePostfix = findCommonBeginningSubstr( initialValueBeforePostfix, From 44b9c67df1409e042027ed544b1f8d75d968b66b Mon Sep 17 00:00:00 2001 From: Andrey Belokopytov Date: Mon, 25 Nov 2024 12:48:03 +0300 Subject: [PATCH 2/6] fix: mirror symbols only if mask changes in postfix-postprocessor --- .../kit/src/lib/processors/postfix-postprocessor.ts | 3 +-- projects/kit/src/lib/utils/extract-affixes.ts | 13 +++++++++++-- 2 files changed, 12 insertions(+), 4 deletions(-) diff --git a/projects/kit/src/lib/processors/postfix-postprocessor.ts b/projects/kit/src/lib/processors/postfix-postprocessor.ts index c3f378075..61d1b62b8 100644 --- a/projects/kit/src/lib/processors/postfix-postprocessor.ts +++ b/projects/kit/src/lib/processors/postfix-postprocessor.ts @@ -26,8 +26,7 @@ export function maskitoPostfixPostprocessorGenerator( '', ); const postfixWasModified = - !value.endsWith(postfix) && - initialElementState.selection[1] >= initialValueBeforePostfix.length; + initialElementState.selection[1] > initialValueBeforePostfix.length; const alreadyExistedValueBeforePostfix = findCommonBeginningSubstr( initialValueBeforePostfix, value, diff --git a/projects/kit/src/lib/utils/extract-affixes.ts b/projects/kit/src/lib/utils/extract-affixes.ts index 4acfacd31..af3569ec1 100644 --- a/projects/kit/src/lib/utils/extract-affixes.ts +++ b/projects/kit/src/lib/utils/extract-affixes.ts @@ -14,7 +14,16 @@ export function extractAffixes( const [extractedPrefix = ''] = value.match(prefixRegExp) ?? []; const [extractedPostfix = ''] = value.match(postfixRegExp) ?? []; - const cleanValue = value.replace(prefixRegExp, '').replace(postfixRegExp, ''); + if (extractedPrefix || extractedPostfix) { + return { + extractedPrefix, + extractedPostfix, + cleanValue: value.slice( + extractedPrefix.length, + extractedPostfix.length ? -extractedPostfix.length : Infinity, + ), + }; + } - return {extractedPrefix, extractedPostfix, cleanValue}; + return {extractedPrefix, extractedPostfix, cleanValue: value}; } From 851652f4251d076b0c49074309de3ea3cc963e88 Mon Sep 17 00:00:00 2001 From: Andrey Belokopytov Date: Mon, 25 Nov 2024 13:49:29 +0300 Subject: [PATCH 3/6] fix: ensure guessValidValueByRegExp does not set selection bigger than validated value length --- .../mask-model/utils/guess-valid-value-by-reg-exp.ts | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/projects/core/src/lib/classes/mask-model/utils/guess-valid-value-by-reg-exp.ts b/projects/core/src/lib/classes/mask-model/utils/guess-valid-value-by-reg-exp.ts index 169c63827..356374458 100644 --- a/projects/core/src/lib/classes/mask-model/utils/guess-valid-value-by-reg-exp.ts +++ b/projects/core/src/lib/classes/mask-model/utils/guess-valid-value-by-reg-exp.ts @@ -22,5 +22,13 @@ export function guessValidValueByRegExp( return newPossibleValue.match(maskRegExp) ? newPossibleValue : validatedValuePart; }, ''); + if (newFrom > validatedValue.length) { + newFrom = validatedValue.length; + } + + if (newTo > validatedValue.length) { + newTo = validatedValue.length; + } + return {value: validatedValue, selection: [newFrom, newTo]}; } From 874cc180373f318caabc145737b03dcd5f5e5de1 Mon Sep 17 00:00:00 2001 From: Andrei Belokopytov Date: Thu, 28 Nov 2024 18:52:19 +0300 Subject: [PATCH 4/6] chore: rename test Co-authored-by: Nikita Barsukov --- .../tests/component-testing/number/mirrored-value-postfix.cy.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts b/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts index 975f2f19b..0785942af 100644 --- a/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts +++ b/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts @@ -24,7 +24,7 @@ describe('Number | [postfix]=" EUR" (no initial value & no caret guard)', () => .should('have.prop', 'selectionEnd', '11.22 '.length); }); - it('Empty input => Paste "11.22 " => Textfield\'s value is "11.22 EUR"', () => { + it('Empty input => Paste "11.22 " (with two trailing spaces) => 11.22 |EUR', () => { cy.get('input') .paste('11.22 ') .should('have.value', '11.22 EUR') From b8ec49ec9cead78572811f41698c95201cbba8b7 Mon Sep 17 00:00:00 2001 From: Andrei Belokopytov Date: Thu, 28 Nov 2024 18:52:29 +0300 Subject: [PATCH 5/6] chore: rename test Co-authored-by: Nikita Barsukov --- .../tests/component-testing/number/mirrored-value-postfix.cy.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts b/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts index 0785942af..5cc067588 100644 --- a/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts +++ b/projects/demo-integrations/src/tests/component-testing/number/mirrored-value-postfix.cy.ts @@ -16,7 +16,7 @@ describe('Number | [postfix]=" EUR" (no initial value & no caret guard)', () => cy.get('input').focus().should('have.value', '').as('input'); }); - it('Empty input => Paste "11.22 " => Textfield\'s value is "11.22 EUR"', () => { + it('Empty input => Paste "11.22 " => 11.22 |EUR', () => { cy.get('input') .paste('11.22 ') .should('have.value', '11.22 EUR') From 5c861bd25d510c62e163c85b65ed6ed035e2321e Mon Sep 17 00:00:00 2001 From: Andrey Belokopytov Date: Thu, 28 Nov 2024 18:33:21 +0300 Subject: [PATCH 6/6] refactor: made the corrections --- .../utils/guess-valid-value-by-reg-exp.ts | 16 ++++++------- projects/kit/src/lib/utils/extract-affixes.ts | 23 +++++++++---------- 2 files changed, 18 insertions(+), 21 deletions(-) diff --git a/projects/core/src/lib/classes/mask-model/utils/guess-valid-value-by-reg-exp.ts b/projects/core/src/lib/classes/mask-model/utils/guess-valid-value-by-reg-exp.ts index 356374458..845bd7432 100644 --- a/projects/core/src/lib/classes/mask-model/utils/guess-valid-value-by-reg-exp.ts +++ b/projects/core/src/lib/classes/mask-model/utils/guess-valid-value-by-reg-exp.ts @@ -22,13 +22,11 @@ export function guessValidValueByRegExp( return newPossibleValue.match(maskRegExp) ? newPossibleValue : validatedValuePart; }, ''); - if (newFrom > validatedValue.length) { - newFrom = validatedValue.length; - } - - if (newTo > validatedValue.length) { - newTo = validatedValue.length; - } - - return {value: validatedValue, selection: [newFrom, newTo]}; + return { + value: validatedValue, + selection: [ + Math.min(newFrom, validatedValue.length), + Math.min(newTo, validatedValue.length), + ], + }; } diff --git a/projects/kit/src/lib/utils/extract-affixes.ts b/projects/kit/src/lib/utils/extract-affixes.ts index af3569ec1..86f03c919 100644 --- a/projects/kit/src/lib/utils/extract-affixes.ts +++ b/projects/kit/src/lib/utils/extract-affixes.ts @@ -14,16 +14,15 @@ export function extractAffixes( const [extractedPrefix = ''] = value.match(prefixRegExp) ?? []; const [extractedPostfix = ''] = value.match(postfixRegExp) ?? []; - if (extractedPrefix || extractedPostfix) { - return { - extractedPrefix, - extractedPostfix, - cleanValue: value.slice( - extractedPrefix.length, - extractedPostfix.length ? -extractedPostfix.length : Infinity, - ), - }; - } - - return {extractedPrefix, extractedPostfix, cleanValue: value}; + return { + extractedPrefix, + extractedPostfix, + cleanValue: + extractedPrefix || extractedPostfix + ? value.slice( + extractedPrefix.length, + extractedPostfix.length ? -extractedPostfix.length : Infinity, + ) + : value, + }; }