From 6e4f54ee6f33513ada254a1a005c509a89ed6101 Mon Sep 17 00:00:00 2001 From: andriikamaldinov1 Date: Mon, 18 Sep 2023 15:09:17 +0300 Subject: [PATCH] fix(1238): fix 1238 --- .../src/lib/ngx-mask-applier.service.ts | 39 +++++++++---- .../src/lib/ngx-mask.directive.ts | 2 +- .../ngx-mask-lib/src/lib/ngx-mask.service.ts | 5 +- .../ngx-mask-lib/src/test/separator.spec.ts | 41 ++++++++++++++ .../ngx-mask-lib/src/test/validation.spec.ts | 55 +++++++++++++++++++ 5 files changed, 129 insertions(+), 13 deletions(-) diff --git a/projects/ngx-mask-lib/src/lib/ngx-mask-applier.service.ts b/projects/ngx-mask-lib/src/lib/ngx-mask-applier.service.ts index f22e443a..f604a393 100644 --- a/projects/ngx-mask-lib/src/lib/ngx-mask-applier.service.ts +++ b/projects/ngx-mask-lib/src/lib/ngx-mask-applier.service.ts @@ -195,18 +195,29 @@ export class NgxMaskApplierService { } // eslint-disable-next-line no-param-reassign inputValue = - inputValue.length > 1 && - inputValue[0] === '0' && - inputValue[1] !== this.thousandSeparator && - !this._compareOrIncludes( - inputValue[1], - this.decimalMarker, - this.thousandSeparator - ) && - !backspaced + inputValue[0] === '-' && this.allowNegativeNumbers + ? inputValue.length > 2 && + inputValue[1] === '0' && + inputValue[2] !== this.thousandSeparator && + !this._compareOrIncludes( + inputValue[2], + this.decimalMarker, + this.thousandSeparator + ) && + !backspaced + ? inputValue.slice(0, inputValue.length - 1) + : inputValue + : inputValue.length > 1 && + inputValue[0] === '0' && + inputValue[1] !== this.thousandSeparator && + !this._compareOrIncludes( + inputValue[1], + this.decimalMarker, + this.thousandSeparator + ) && + !backspaced ? inputValue.slice(0, inputValue.length - 1) : inputValue; - if (backspaced) { // eslint-disable-next-line no-param-reassign inputValue = this._compareOrIncludes( @@ -661,6 +672,14 @@ export class NgxMaskApplierService { return res; } + public _findDropSpecialChar(inputSymbol: string): undefined | string { + if (Array.isArray(this.dropSpecialCharacters)) { + return this.dropSpecialCharacters.find((val: string) => val === inputSymbol); + } + + return this._findSpecialChar(inputSymbol); + } + public _findSpecialChar(inputSymbol: string): undefined | string { return this.specialCharacters.find((val: string) => val === inputSymbol); } diff --git a/projects/ngx-mask-lib/src/lib/ngx-mask.directive.ts b/projects/ngx-mask-lib/src/lib/ngx-mask.directive.ts index 603a633c..6b10da1a 100644 --- a/projects/ngx-mask-lib/src/lib/ngx-mask.directive.ts +++ b/projects/ngx-mask-lib/src/lib/ngx-mask.directive.ts @@ -336,7 +336,7 @@ export class NgxMaskDirective implements ControlValueAccessor, OnChanges, Valida const array = this._maskValue.split('*'); const length: number = this._maskService.dropSpecialCharacters ? this._maskValue.length - - this._maskService.checkSpecialCharAmount(this._maskValue) - + this._maskService.checkDropSpecialCharAmount(this._maskValue) - counterOfOpt : this.prefix ? this._maskValue.length + this.prefix.length - counterOfOpt diff --git a/projects/ngx-mask-lib/src/lib/ngx-mask.service.ts b/projects/ngx-mask-lib/src/lib/ngx-mask.service.ts index 2ee820b5..443021f1 100644 --- a/projects/ngx-mask-lib/src/lib/ngx-mask.service.ts +++ b/projects/ngx-mask-lib/src/lib/ngx-mask.service.ts @@ -394,10 +394,10 @@ export class NgxMaskService extends NgxMaskApplierService { ); } - public checkSpecialCharAmount(mask: string): number { + public checkDropSpecialCharAmount(mask: string): number { const chars: string[] = mask .split(MaskExpression.EMPTY_STRING) - .filter((item: string) => this._findSpecialChar(item)); + .filter((item: string) => this._findDropSpecialChar(item)); return chars.length; } @@ -630,6 +630,7 @@ export class NgxMaskService extends NgxMaskApplierService { if (result === MaskExpression.EMPTY_STRING) { return result; } + if ( this.maskExpression.startsWith(MaskExpression.PERCENT) && this.decimalMarker === MaskExpression.COMMA diff --git a/projects/ngx-mask-lib/src/test/separator.spec.ts b/projects/ngx-mask-lib/src/test/separator.spec.ts index 19a812af..aff7d6f0 100644 --- a/projects/ngx-mask-lib/src/test/separator.spec.ts +++ b/projects/ngx-mask-lib/src/test/separator.spec.ts @@ -1114,4 +1114,45 @@ describe('Separator: Mask', () => { tick(); expect(inputTarget.value).toBe('3.000,40'); })); + + it('should not allow add two zeros to inputValue', fakeAsync(() => { + component.mask = 'separator.2'; + component.leadZero = true; + component.decimalMarker = ','; + component.thousandSeparator = '.'; + component.allowNegativeNumbers = true; + fixture.detectChanges(); + + equal('-00', '-0', fixture); + })); + + it('should not allow add two zeros to inputValue', fakeAsync(() => { + component.mask = 'separator.2'; + component.decimalMarker = '.'; + component.thousandSeparator = ','; + component.allowNegativeNumbers = true; + fixture.detectChanges(); + + equal('-00', '-0', fixture); + })); + + it('should not allow add two zeros to inputValue', fakeAsync(() => { + component.mask = 'separator.2'; + component.decimalMarker = ','; + component.thousandSeparator = '.'; + component.allowNegativeNumbers = true; + fixture.detectChanges(); + + equal('-00', '-0', fixture); + })); + + it('should not allow add two zeros to inputValue', fakeAsync(() => { + component.mask = 'separator.2'; + component.decimalMarker = ','; + component.thousandSeparator = ' '; + component.allowNegativeNumbers = true; + fixture.detectChanges(); + + equal('-00', '-0', fixture); + })); }); diff --git a/projects/ngx-mask-lib/src/test/validation.spec.ts b/projects/ngx-mask-lib/src/test/validation.spec.ts index ee4da5db..8af36d5a 100644 --- a/projects/ngx-mask-lib/src/test/validation.spec.ts +++ b/projects/ngx-mask-lib/src/test/validation.spec.ts @@ -67,6 +67,25 @@ export class TestValidatorNumber { public validate = true; } +@Component({ + selector: 'jsdaddy-open-source-test', + template: ` + + `, +}) +// eslint-disable-next-line @angular-eslint/component-class-suffix +export class TestValidatorDropSpecialCharacters { + public form: FormControl = new FormControl('+373', Validators.required); + public mask = '+000'; + public specialCharacters = ['+', ' ']; + public dropSpecialCharacters = [' ']; +} + describe('Directive: Mask (Validation)', () => { describe('Global validation true, validation attribute on input not specified', () => { let fixture: ComponentFixture; @@ -366,4 +385,40 @@ describe('Directive: Mask (Validation)', () => { expect(component.form.value).toBe(44431); }); }); + + describe('Global validation true, dropSpecialCharacters attribute on input specified as array', () => { + let fixture: ComponentFixture; + let component: TestValidatorDropSpecialCharacters; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [TestValidatorDropSpecialCharacters], + imports: [ReactiveFormsModule, NgxMaskDirective], + providers: [provideNgxMask({ validation: true })], + }); + fixture = TestBed.createComponent(TestValidatorDropSpecialCharacters); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('dropSpecialCharacters is different from specialCharacters', () => { + component.mask = '+000'; + component.specialCharacters = ['+', ' ']; + component.dropSpecialCharacters = [' ']; + + equal('+37', '+37', fixture); + expect(component.form.valid).toBe(false); + + equal('+373', '+373', fixture); + expect(component.form.valid).toBe(true); + + component.mask = '+000 000 00 000'; + + equal('+3736000000', '+373 600 00 00', fixture); + expect(component.form.valid).toBe(false); + + equal('+37360000000', '+373 600 00 000', fixture); + expect(component.form.valid).toBe(true); + }); + }); });