fix(auto-resize): stop re-dispatching input event on programmatic value writes#3206
Merged
segunadebayo merged 3 commits intoJul 20, 2026
Merged
Conversation
🦋 Changeset detectedLatest commit: 2854505 The changes in this PR will be included in the next version bump. This PR includes changesets to release 86 packages
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 |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Add basic/controlled autoresize examples for Nuxt, Solid, Svelte, and Preact, plus Playwright tests for typing and paste. Also set the Svelte app document title.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #3204
📝 Description
autoresizeTextareaoverrides the element'svaluesetter and re-dispatches a bubblinginputevent on every programmatic value change. React writes.valueprogrammatically when reconciling controlled inputs and relies on those writes being side-effect-free, so the synthesized event fires the framework'sonChangea second time with the value React just restored, reverting the controlled state.The synthetic event was added in 5bd226d (
fix: autoresize + input event) to work around a real bug: the override reads thevaluedescriptor from the prototype but defines the property on the element, which clobbers the own-property value tracker React installs at mount (inputValueTracking). With the tracker no longer seeing programmatic writes, its last-known value goes stale and React swallows the next genuineinputevent — the type → clear → retype case inexamples/next-ts/pages/autoresize-controlled.tsx.This PR fixes that root cause instead: the setter override now wraps the element's own
valuedescriptor (the framework tracker) when one is present, falling back to the prototype descriptor otherwise. Programmatic writes keep flowing through the tracker, so it stays in sync and noinputevent needs to be synthesized.resize()was already called synchronously inside the setter, so resizing behavior is unchanged.⛳️ Current behavior (updates)
For a controlled textarea with autoresize whose state isn't committed synchronously (input rejection, external stores/signals):
onChangetwice — once with the typed value, then again with the restored previous value, reverting the controlled state🚀 New behavior
onChangefires once per keystroke; programmatic.valuewrites no longer dispatchinputevents💣 Is this a breaking change (Yes/No):
No. Code that relied on receiving the synthesized
inputevent after programmatic writes would no longer get it, but that event only existed as a workaround and is exactly what corrupts controlled inputs.📝 Additional Information
Added unit tests in
packages/utilities/auto-resize/tests/autoresize-textarea.test.tsthat emulate React's value tracking and change deduplication. All four fail onmainand pass with this fix. I ran the vitest suite forpackages/utilitieslocally; I was not able to run the Playwright suite in this environment.