renato-bohler / redux-form-input-masks

Input masking with redux-form made easy
https://bohler.dev/redux-form-input-masks/
MIT License
138 stars 10 forks source link

Cursor (caret) jumps to end of input, then returns to correct position #47

Closed felixakiragreen closed 6 years ago

felixakiragreen commented 6 years ago

What are you reporting?

What is the current behavior?

As the user is typing, the caret jumps to end, then returns to the correct position. phone_number

What is the expected behavior?

The user should just be able to type normally without needing to reset the caret position.

What's your environment?

Version: 1.1.5 OS: Mac OS X 10.11 Browser: Chrome 67 Node version: 8.9.2

Other information

I downloaded the repo, and started messing around in the code to see if I could figure it out. It seems to be related to this React issue: https://github.com/facebook/react/issues/955

I will continue investigating and see if I can find a fix.

felixakiragreen commented 6 years ago

Update: From what I can tell, the primary culprit is Redux-form, because format()/normalize() pretty much clobbers everything. Related issues: https://github.com/erikras/redux-form/issues/2049 https://github.com/erikras/redux-form/issues/3253 https://github.com/erikras/redux-form/issues/3306

This may not be fixable within redux-form-input-masks.

renato-bohler commented 6 years ago

Yeah, I've tried my best to fix this but it was really beyond me.

The only way to avoid this behaviour is setting the guide option to false. I'm also thinking in changing guide's default value to false in v2.0.0.

I'm closing this by now. If you have any other suggestion on this topic, feel free to reopen.

Thanks for reporting!