[React 19] Controlled number input does not update defaultValue when value prop has changed

[BrendonSled]

Summary

Controlled inputs with the type=number are not setting the defaultValue when the value state is altered. This causes the state and value to become out of sync when a form is reset (for instance after a form action is sent).

https://codesandbox.io/p/github/BrendonSled/react-19-controlled-input-number-bug/

[Sunilverma99]

29862

The issue arises because the useEffect hook depends on both value1 and value2, causing the value not to update properly. By removing the dependencies on value1 and value2, the component functions correctly.

[Musaeeb-Zahir]

Hi

[BrendonSled]

@Sunilverma99 you're inspecting the wrong values there. This issue is specifically around the defaultValue that is set so when a form is reset the values are not correct. If you inspect the element you can get a better example of what is happening here. All other input types will have the html attributes change except type=number

[BrendonSled]

https://codesandbox.io/p/github/BrendonSled/react-19-controlled-input-number-bug/new-example

This might be a better example of the exact issue I'm facing. If you input hit the enter key while focused in the number input the field value will be erased on the form submit even though the state is still the old value.

[github-actions[bot]]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

[github-actions[bot]]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!