Ghost characters shown in input when toggling mask on/off

[Res42]

🐞 bug report

Description

Bug can be reproduced when using an "optional" mask (NOT optional characters) like in the reproduction by setting the [mask] input to something then to undefined.

Context: a simple 4 number mask input, but the mask can be toggled on/off. My use case is not a button toggle, but simply toggling the mask programmatically. But it is easier to show the problem with a button.

Scenario 1

Steps:

1. Write any 4 length number into the input, like "1234" with the mask on.
2. Then do not finish typing but write any other character(s).
3. Toggle the mask off.
4. Bug: you will see the last typed character (from 2.) in the input. The FormControl.value is good ("1234"). I do not want to see this extra character in the input.

Scenario 2

Steps:

1. Write letters into the input with the mask off, like "asd".
2. Toggle the mask on. The input and the value will be set to "" because of the mask. This is okay.
3. Toggle the mask off.
4. Bug: you will see your previously written letters in the input. The FormControl.value is good (""). I do not want to see these extra characters in the input.

🔬 Minimal Reproduction

https://stackblitz.com/edit/ngx-mask-ghost-input-value?file=src%2Fapp%2Fapp.component.html

🌍 Your Environment

Angular Version:

^11.0.8

ngx-mask Version:

11.1.5

[NepipenkoIgor]

@Res42 Hi . Thank you for using our package. Please check version >13.1.6