Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using [keepCharacterPositions], [shownMaskExpression], and [specialCharacters] does not move the cursor to the next available selection index #1489

Open
NerdyNProud opened this issue Jan 8, 2025 · 0 comments

Comments

@NerdyNProud
Copy link

🐞 bug report

Is this a regression?

This issue is not regression and has been reproduced in 16.0.2 (where [keepCharacterPositions] was introduced) and the current version at time of writing (19.0.6).

Description

Given an input set to [keepCharacterPositions] and a [shownMaskExpression] containing [specialCharacters], user inputs may be dropped and not actually be included in the input's value depending on the selection index of the input in relation to the special characters of the mask. Normally when the user enters a value and the selection index is at a special character, the cursor moves forward to the following character and submits the value there, but I have found two scenarios where the cursor does not move forward correctly and the input from the user is lost.

Method to Reproduce 1:

  1. Have an input with a [shownMaskExpression] containing a special character as the first character. The rest of [shownMaskExpression] does not matter.
  2. Ensure that the special character is listed in [specialCharacters] and that [keepCharacterPositions] is set to "true".
  3. Enter a value into your input, then hit "ctrl+a" to select the entire contents.
  4. Enter any value to replace the existing one.

From my testing I found that in this scenario the first key that is entered by the user in Step 4 is lost as the cursor is in front of the special character at this time.

Method to Reproduce 2:

  1. Have an input with a [shownMaskExpression] containing two special characters next to each other anywhere in the mask. The rest of the [shownMaskExpression] does not matter.
  2. Ensure the special characters are listed in [specialCharacters] and that [keepCharacterPositions] is set to "true".
  3. Fully enter a value into your mask.

From my testing I found that in this scenario when the cursor reaches the two adjacent special characters the input from the user will be lost, moving the cursor in between the two special characters. At this point the user may continue entering in values, but the key pressed at the start of the two special characters will be lost.

🔬 Minimal Reproduction

https://stackblitz.com/edit/ngx-mask-kcp-sme-sc-incompatibility?file=src%2Fapp%2Fapp.component.html

🔥 Exception or Error

No errors or exceptions are thrown.

🌍 Your Environment

Angular Version:

Angular CLI: 18.2.1
Node: 23.3.0 (Unsupported)
Package Manager: npm 10.9.0
OS: win32 x64

Angular: undefined
...

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.1802.1 (cli-only)
@angular-devkit/core         18.2.1 (cli-only)
@angular-devkit/schematics   18.2.1 (cli-only)
@schematics/angular          18.2.1 (cli-only)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant