angular-ui / ui-mask

Mask on an input field so the user can only type pre-determined pattern
https://htmlpreview.github.io/?https://github.com/angular-ui/ui-mask/master/demo/index.html
MIT License
391 stars 258 forks source link

Glitch if mask contains prefix and prefix has space character #228

Open jrencz opened 7 years ago

jrencz commented 7 years ago

I have 2 fields in my project requiring mask to have some prefix. Prefix is supposed to be shown inside the field (just as mask is)

Another story is that I have my own directive to apply this prefix to both mask and model value for my own convenience, but this bug is not related to that code since I was able to reproduce it on Codepen (linked below)

Current latest release of uiMask (1.8.7) has a bug that causes characters from prefix occurring after a space characterto be copied into masked part of the input in case prefix has space character in it if one of prefix characters happens to be a meaningful character for the mask.

e.g. if prefix is 1234 89 and then mask is 99 9999 9999 (I'm interested in gathering last 10 out of 16 digits of Payback card) when field is focused value becomes 1234 8989 instead of expected 1234 89 __ ____

Additional 89 is removed on blur unless clearOnBlur is set to false (which is my case). If it's set to true on each focus another 89 is added to model.

What's interesting: Replacing space with a non-breaking space in the prefix only is a workaround.

Example presenting all above: https://codepen.io/jrencz/pen/GvmxyL