react-hook-form / resolvers

📋 Validation resolvers: Yup, Zod, Superstruct, Joi, Vest, Class Validator, io-ts, Nope, computed-types, typanion, Ajv, TypeBox, ArkType, Valibot, effect-ts and VineJS
https://react-hook-form.com/
MIT License
1.72k stars 157 forks source link

zodResolver errors are empty #562

Closed minajevs closed 1 year ago

minajevs commented 1 year ago

Describe the bug

When using zodResolver formState errors are empty.

To Reproduce

Tested versions (all latest): @hookform/resolvers: 3.0.0, 3.1.0 react-hook-form: 7.43.9 zod: 3.21.4

Consider basic schema:

const schema = z.object({
  name: z.string().min(3, "Required")
});

and zodResolver:

const {
  register,
  formState: { errors }
} = useForm({ resolver: zodResolver(schema) });

and form:

<form>
   <input {...register("name")} />
   <span>{errors?.name?.message?.toString()}</span>
   <button type="submit">submit</button>
 </form>

then errors object is always empty.

Codesandbox link (Required) https://codesandbox.io/s/affectionate-feather-q20cwg?file=/src/App.tsx

Additional context

isValid works as expected. When debuggin resolver like this:

resolver: async (data, context, options) => {
    console.log('formData', data)
    console.log('validation result', await zodResolver(schema)(data, context, options))
    return zodResolver(schema)(data, context, options)
},

validation result actually includes errors, but formState errors are still empty

minajevs commented 1 year ago

@bluebill1049 I am sorry, why is it completed? What kind of detail should I add? I think codesandbox example is the most minimal and reproducing.

tekno0ryder commented 1 year ago

Hi @minajevs,

You forgot to handle submission so the app is restarting when u click submit and the state will be empty, alternatively I changed the mode to onChange so u can see the errors without submit in this codesandbox