fix(hidden-input) input programmatically value set without phantom values

projects/ngx-mask-lib/src/lib/mask.service.ts

@@ -55,7 +55,7 @@ export class MaskService extends MaskApplierService {
     }
     const getSymbol: string = !!inputValue && typeof this.selStart === 'number' ? inputValue[this.selStart] : '';
     let newInputValue = '';
-    if (this.hiddenInput !== undefined) {
+    if (this.hiddenInput && !this.writingValue) {
       let actualResult: string[] = this.actualValue.split('');
       // tslint:disable no-unused-expression
       inputValue !== '' && actualResult.length
@@ -70,7 +70,10 @@ export class MaskService extends MaskApplierService {
           : null
         : (actualResult = []);
       // tslint:enable no-unused-expression
-      newInputValue = this.actualValue.length ? this.shiftTypedSymbols(actualResult.join('')) : inputValue;
+      newInputValue =
+        this.actualValue.length && actualResult.length <= inputValue.length
+          ? this.shiftTypedSymbols(actualResult.join(''))
+          : inputValue;
     }
     newInputValue = Boolean(newInputValue) && newInputValue.length ? newInputValue : inputValue;
     const result: string = super.applyMask(newInputValue, maskExpression, position, justPasted, backspaced, cb);
@@ -333,7 +336,7 @@ export class MaskService extends MaskApplierService {
   }
 
   private _toNumber(value: string | number | undefined | null) {
-    if (!this.isNumberValue) {
+    if (!this.isNumberValue || value === '') {
       return value;
     }
     const num = Number(value);

projects/ngx-mask-lib/src/test/secure-mask.spec.ts

@@ -3,7 +3,7 @@ import { ReactiveFormsModule } from '@angular/forms';
 
 import { NgxMaskModule } from '../lib/ngx-mask.module';
 import { TestMaskComponent } from './utils/test-component.component';
-import { equal } from './utils/test-functions.component';
+import { equal, typeTest } from './utils/test-functions.component';
 
 describe('Directive: Mask (Secure)', () => {
   let fixture: ComponentFixture<TestMaskComponent>;
@@ -60,4 +60,32 @@ describe('Directive: Mask (Secure)', () => {
     equal('123456789', '1234-*6-***', fixture);
     expect(component.form.value).toBe('123456789');
   });
+
+  it('it checks secure input functionality on reset', () => {
+    component.mask = 'XXX/X0/0000';
+    component.hiddenInput = true;
+    typeTest('54321', fixture);
+    component.form.reset('98765');
+    fixture.whenStable().then(() => {
+      expect(fixture.nativeElement.querySelector('input').value).toBe('***/*5');
+    });
+  });
+
+  it('it checks secure input functionality on reset then typed', () => {
+    component.mask = 'XXX/X0/0000';
+    component.hiddenInput = true;
+    typeTest('54321', fixture);
+    component.form.reset();
+    equal('98765', '***/*5', fixture);
+  });
+
+  it('it checks secure input functionality on setValue(longer string)', () => {
+    component.mask = 'XXX/X0/0000';
+    component.hiddenInput = true;
+    typeTest('54321', fixture);
+    component.form.setValue('1234567');
+    fixture.whenStable().then(() => {
+      expect(fixture.nativeElement.querySelector('input').value).toBe('***/*5/67');
+    });
+  });
 });

src/app/bugs/bugs.component.html

@@ -139,6 +139,31 @@
     </div>
   </div>
 
+  <div class="container box">
+    <div class="row">
+      <div class="col-12">
+        <label for="SecureInput">Form reset on hidden mask</label>
+        <div>
+          <p>
+            <input
+              type="text"
+              placeholder="Secure input"
+              [hiddenInput]="true"
+              mask="XXX-X0-0000"
+              formControlName="SecureInput"
+              id="SecureInput"
+            />
+          </p>
+          <p>
+            Valid: {{ bugsForm.controls.SecureInput.valid }}<br />
+            Value: {{ bugsForm.controls.SecureInput.value }}<br />
+            Errors: {{ bugsForm.controls.SecureInput.errors | json }}
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+
   <div class="container box">
     <div class="row">
       <div class="col-12">

src/app/bugs/bugs.component.ts

@@ -19,6 +19,7 @@ export class BugsComponent implements OnInit, OnDestroy {
       DecMarkerComma: [],
       DecMarkerDot: [],
       CorrectRemovingSpace: [1200300.99],
+      SecureInput: [987654321],
     });
   }