RobinHerbots / RobinHerbots/Inputmask

Input mask duplicates character on Android

Open
#2,575 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
6.5k
Forks
2.1k
Avg merge
4d 16h
Merged PRs (30d)
1

Description

I'm submitting a...


[ ] Regression (a behavior that used to work and stopped working in a new release)
[X] Bug report 
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request
[ ] Other... Please describe:

Current behavior

In an android using Google Board and Chrome (96) with a mask using ('aa99 9999') as mask, it will duplicate the 5th character introduced by the user if the placeholder is set to '' or ' '.

Expected behavior

It should not duplicate the 5th character.

Minimal reproduction of the problem with instructions

When using chrome on android, if using 'aa99 9999 9999 9999 9999 99' as a Mask, with placeholder (' '), when introducing the 5th character, it auto duplicates it.
Only being able to reproduce with android devices using Google Board. i.e: Won't happen with SwiftKey Keyboard

https://stackblitz.com/edit/angular-ivy-qzy73n?file=src%2Fapp%2Fapp.component.html
Open the link from the device matching the browser and keyboard and reproduce.

Environment


Angular version: Reproduced in both Angular 12 and Angular 11

Browser:
- [ ] Chrome (desktop) version XX
- [X] Chrome (Android) version 96 (Android 11)
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
 

Inputmask version

5.0.6

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked StackBlitz reproduction on an Android device using Chrome 96 and Google Keyboard, using the specified mask and a single-space or empty placeholder. Compare the duplicated fifth character against the expected input, then trace the relevant Inputmask behavior; the issue is done when that character is entered only once without breaking the stated reproduction cases.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, javascript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.