Skip to content

Conversation

fabhari
Copy link
Contributor

@fabhari fabhari commented Aug 19, 2025

Old Fix: Restore input binding selection position (#14649) .
Current Fix: Remove unnecessary cursor manipulation written for (#14649) as the presence of runes no longer requires special handling.

This fix closes #16634

Before submitting the PR, please make sure you do the following

  • It's really useful if your PR references an issue where it is discussed ahead of time. In many cases, features are absent for a reason. For large changes, please create an RFC: https://github.com/sveltejs/rfcs
  • Prefix your PR title with feat:, fix:, chore:, or docs:.
  • This message body should clearly illustrate what problems it solves.
  • Ideally, include a test that fails without this PR but passes with it.
  • If this PR changes code within packages/svelte/src, add a changeset (npx changeset).

Tests and linting

  • Run the tests with pnpm test and lint the project with pnpm lint

Old Fix: Restore input binding selection position (sveltejs#14649)
Current Fix: Remove unnecessary cursor manipulation as the presence of runes no longer requires special handling.
Copy link

changeset-bot bot commented Aug 19, 2025

🦋 Changeset detected

Latest commit: 0357b5f

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
svelte Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Copy link
Contributor

Playground

pnpm add https://pkg.pr.new/svelte@16649

@fabhari fabhari changed the title Bug/input two way binding Fix : cursor jumps in input two way binding Aug 20, 2025
@fabhari fabhari changed the title Fix : cursor jumps in input two way binding fix : cursor jumps in input two way binding Aug 20, 2025
@fabhari fabhari changed the title fix : cursor jumps in input two way binding fix: cursor jumps in input two way binding Aug 20, 2025
@7nik
Copy link
Contributor

7nik commented Aug 20, 2025

This breaks a case like this (compare to the latest version)

<input bind:value={() => name, v => name = v.toUpperCase()} />

To elaborate: the input and the variable get desynced.

Introduced Promise.resolve to ensure that the 'set' operation completes before the 'get' operation Minimizing update delays.
@fabhari
Copy link
Contributor Author

fabhari commented Aug 22, 2025

Hey @7nik Thanks for highlighting that.
hope have fixed the issue by syncing the set and get callbacks using promises to always execute in an order .had to stop get cb excuting before set cb which led to desync

@svelte-docs-bot
Copy link

@7nik
Copy link
Contributor

7nik commented Aug 25, 2025

So, now the input and the variable get desynced because of the "Never rewrite the contents of a focused input" case. But don't we still want to write if it's the latest batch?

@Rich-Harris
Copy link
Member

Ah whoops, you're right. So yes, we do need to handle it in the event handler and not in the subsequent effect, and the reason we can't do it immediately is because of a quirk of how each blocks work — the item is a source that gets updated during flush rather than a derived, which means an immediate get may not reflect the current state.

Updated the PR to make that explicit.

Thanks!

@Rich-Harris
Copy link
Member

gah the test failure is bizarre. Passes fine when the test runs individually but not when the entire suite runs?

@Rich-Harris Rich-Harris merged commit 0d48916 into sveltejs:main Aug 25, 2025
13 of 14 checks passed
This was referenced Aug 25, 2025
@fabhari
Copy link
Contributor Author

fabhari commented Aug 26, 2025

Hi @Rich-Harris , quick question out of curiosity.

I noticed the latest commit you have changed is the callback method to be async & waiting for requestAnimationFrame().

I am wondering how this approach differs from my simpler solution which waits for SET synchronous callback to end first and the call GET. What potential drawbacks my solution might have. ?

Could you help me understand the benefits and perhaps suggest an even better way to handle this?
Hey @7nik @Rich-Harris can anyone help me understand this difference in handling or negative impact my solution has ?

@fabhari fabhari deleted the bug/input-two-way-binding branch August 26, 2025 15:59
@7nik
Copy link
Contributor

7nik commented Aug 26, 2025

.then(...) is always executed in a new microtask. But in async Svelte, settling reactivity may take multiple microtasks. This is why tick() should be used.

@fabhari
Copy link
Contributor Author

fabhari commented Aug 27, 2025

great. thanks for the info @7nik

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

Successfully merging this pull request may close these issues.

Two way binding to a property of an object in an array update is delayed
3 participants