onChange and onBlur validation errors should prevent submission of form

[crutchcorn]

Currently, when using a field with:

<Field onChange={z.string().min(1)}>

When the user submits the form, it does not show a form error on submit. This causes headaches currently as it makes things harder to workflow properly.

[vikaskumar89]

Hey @crutchcorn
Can you assign this to me please

[MiirzaBaig]

Can you aasign this issue to me?

[vikaskumar89]

hey @I-MirzaBaig
I am working on this. Could you pick any other open issue.

[MiirzaBaig]

@vikaskumar89 Alright!

[vikaskumar89]

Hey @crutchcorn
The root cause of this error is because we have defined undefined for the submit cause that leads to validateSync returning early and not executing any onBlur/onChange validation.

error rootcause:

form/packages/form-core/src/FieldApi.ts

Line 337 in fd19453

if (!validate) return

One solution that comes to my mind is in case of submit cause, we can execute either onChange or onBlur validation(whichever is defined in the field) but this would lead to incorrect errorMap detail in the state as the errorMapKey would be submit and the error would correspond to onChange/onBlur.

Do you have any alternate suggestion to fix this ?

[vikaskumar89]

Due to this errorMap array, we are facing this issue in #486, as the errorMap is not clear after a valid value is entered.

[danteissaias]

Is there currently a workaround to this?

[vikaskumar89]

@danteissaias yeah fix should be out in a couple of days.

[crutchcorn]

This fix is released in 0.10.0!