Unexpected interaction during IBAN entry with pattern mask on Android 11

[sebastian-hans-swm]

Describe the bug
We are using imask to prettify an IBAN entry field using the pattern '**** **** **** **** **** **** ****'. On Android 11, typing into this field yields unexpected results after the 5th character. When typing 'D', 'E', '4', '0', '5', the following happens after '5':

• In Firefox 100.3.0 the keyboard changes from the symbol/number keyboard (which was used to input the digits) to the alphabetic keyboard. Typing further elicits no unexpected behaviour.
• In Chrome 101.0.4951.41 the previously entered characters are duplicated to read 'DE40 5DE4 05'. Typing further elicits no unexpected behaviour.

The behaviour is present in imask 6.4.2, but seems to have appeared in imask 6.0.1. It works fine in imask 6.0.0.

To Reproduce
Reproduce with this minimal example: https://codepen.io/sebastian-hans-swm/pen/LYQyeJg

Expected behavior
I expect the input field to read 'DE40 5' after typing the '5' and to not change the keyboard or other strange interactions.

Environment:

• OS: Android 11
• Browser:
  • Firefox 100.3.0
  • Chrome 101.0.4951.41
• IMask version: 6.0.1 through 6.4.2
• Framework/plugin version if used: We use angular-imask 6.4.2 but reproduced the issue in pure imask.

Additional context
It seems to work fine on Android 12 as well as on iOS (with Safari).

We originally discovered this issue because a user reported a problem with Firefox on Android 11. On this device the input field was cleared after typing '5'. This was in production with angular-imask 6.4.2. We were not able to reproduce the issue with a minimal example, but during the course of our investigations we discovered the problem described above. We think it may be related.