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

Cursor Jumps to end of input after component is remounted #207

Open
chriswhong opened this issue Mar 16, 2023 · 0 comments
Open

Cursor Jumps to end of input after component is remounted #207

chriswhong opened this issue Mar 16, 2023 · 0 comments

Comments

@chriswhong
Copy link
Contributor

Recently this bug came up when using Form with ControlText in what-the-tile:

  • User enters text into the inpute
  • User presses enter (form submits, app handles updated input value and does things)
  • User wants to change the value of the input, places cursor in the middle of the string in the input.
  • User types a character, it appears in the correct place, but the cursor immediately jumps to the end of the input and subsequent characters are typed there.

This is known behavior in react when a controlled input re-mounts: https://stackoverflow.com/questions/45199687/react-input-cursor-moves-to-the-end-after-update

We can see the same behavior in the mr-ui docs example of Form: https://mapbox.github.io/mr-ui/#form

We didn't have a good reason to be using Form so just used ControlText directly to get around this, but I wanted to open an issue to document it in case it comes up again. It might be worth checking places that are implementing Form to see how it behaves in the real world.

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