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

[regression] Preact 10.14.0 breaks selection offset on controlled text inputs #4004

Closed
1 task
birtles opened this issue May 15, 2023 · 2 comments · Fixed by #4005
Closed
1 task

[regression] Preact 10.14.0 breaks selection offset on controlled text inputs #4004

birtles opened this issue May 15, 2023 · 2 comments · Fixed by #4005

Comments

@birtles
Copy link

birtles commented May 15, 2023

  • Check if updating to the latest Preact version resolves the issue (it does not)

Describe the bug
A clear and concise description of what the bug is.

After upgrading to Preact 10.14.0, for controlled text inputs, the selection is reset in certain cases.

To Reproduce

Steps to reproduce the behavior:

  1. Go to https://codesandbox.io/s/crazy-field-ng230t
  2. Click on the text input box (after waiting for it to render)
  3. Type "abc"
  4. Move the cursor between "a" and "b"
  5. Press Backspace

Expected behavior
What should have happened when following the steps above?

The "a" should be deleted leaving "bc" but with the text selection in front of "bc".

Actual behavior

"a" is deleted leaving "bc" but the cursor is moved to after "bc".

Tested with Firefox and Chrome on Windows. This did not happen with 10.13.2.

@marvinhagemeister
Copy link
Member

marvinhagemeister commented May 15, 2023

Tracked down the source of this issue to this PR #3926 . I cannot reproduce the error without compat. Delaying the value setting in afterEvent by delaying it by another Promise tick seems to resolve it. Not sure if this is the proper fix though.

  function afterEvent(eventType, target) {
    if (target.value != null && target.value !== target._prevValue) {
-    target.value = target._prevValue;
+    Promise.resolve().then(() => target.value = target._prevValue);
    }
    if (eventType === 'change' && target.checked != null) {
      target.checked = target._prevValue;
    }
  }

cc @andrewiggins

@developit
Copy link
Member

@marvinhagemeister waiting one tick actually seems reasonable here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants