DigitalRiver / react-atlas

Composable React components with CSS Modules.
http://digitalriver.github.io/react-atlas/
MIT License
38 stars 25 forks source link

TextField Mask loses key when typing over a constant #915

Open bwilliams-un opened 5 years ago

bwilliams-un commented 5 years ago

Steps to reproduce:

  1. Create a TextField with mask="11/11"
  2. Type two numbers, cursor will appear after the forward slash 11/|__
  3. Press Backspace, the cursor moves to 11|/__
  4. Type a number

Expected behavior: The character typed appears after the /.

Actual behavior: The cursor moves after the / but the key press is consumed and never appears.

This could be related to the fact that Backspace should consume the 11 and not move the cursor (it's trying to remove the constant). It could be a bug with the mask library and not our code, we should verify and try to resolve.

stuller commented 5 years ago

mask library documentation: https://github.com/insin/inputmask-core it looks like we're using mask.backspace, and that seems to be intended behavior for mask.backspace - see the quote below.

backspace() : boolean
Performs a backspace operation based on the current selection.

If the cursor is positioned after a static part of the mask, the cursor will be placed before it.
bwilliams-un commented 5 years ago

Backspace behavior doesn't bother me. The issue that typing into a constant loses a valid key press that is not backspace is a problem.

stuller commented 5 years ago

yeah, still looking to see if that's a library thing or the way we're using it