form icon indicating copy to clipboard operation
form copied to clipboard

First input ignored after action completes

Open aaronfulkerson opened this issue 9 months ago • 5 comments

Describe the bug

After submitting the form and the action returns, the first input on the form is ignored.

Your minimal, reproducible example

https://github.com/aaronfulkerson/tanstack-form-validation

Steps to reproduce

  1. Don't enter any values
  2. Hit submit
  3. Wait for the action to complete (3 seconds in the repo provided)
  4. Attempt to add a value to the form

Expected behavior

As a user I expected the form to respond to my input but instead the first input is ignored.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

  • macOS 15.3.2
  • Arc
  • 1.86

TanStack Form adapter

react-form

TanStack Form version

1.1.0

TypeScript version

5.8.2

Additional context

No response

aaronfulkerson avatar Mar 18 '25 21:03 aaronfulkerson

The serverValidate method returns the old values as part of the error, which get merged back over your changed state in transform. Unsure why it is done this way but you can delete state.values in the transform method as a short-term fix.

MVaik avatar Mar 21 '25 21:03 MVaik

Why does that prevent the form from receiving user input?

aaronfulkerson avatar Mar 22 '25 13:03 aaronfulkerson

The form receives user input, the error result just overwrites it.

MVaik avatar Mar 29 '25 17:03 MVaik

The form receives user input, the error result just overwrites it.

No, brother. That’s why I say “wait for the action to complete”. Try it.

aaronfulkerson avatar Mar 29 '25 20:03 aaronfulkerson

Alright I get what you meant, but the reason is the same, the error result that has empty fields gets merged over state on first keypress for some reason.

MVaik avatar Apr 05 '25 15:04 MVaik