Skip to content

Async refinements cause form to always submit #55

@Briaoeuidhtns

Description

@Briaoeuidhtns

If the schema contains an async refinement then zod throws Uncaught Error: Async refinement encountered during synchronous parse operation. Use .parseAsync instead., onValidSubmit never gets called, and the form submits via the default mechanism.

repro


I'd switch it to use parseAsync but this kinda seems like a fundamental issue with calling the method that should call preventDefault after a possibly async function, and I'm not sure what solution would be preferable.

One option would be to have a shouldPreventDefault option to useZorm and then call preventDefault before validation happens if true. This handles what I assume is the common case, but doesn't fix it in the case that the user wants to do something after the form is validated but before submit is handled by the normal mechanism.

The other option I see is to just always call preventDefault, do the validation, call onValidSubmit with a preventDefault that just sets a ref, and if that one wasn't called after the handler returns then detach from the form and resubmit the form to get the default behavior. This one could also allow calling preventDefault after an await in an async onValidSubmit, which seems easy enough to accidentally do.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions