Zod Validation doesn't work with auto form.

[Blaise Tiong]

I have added zod validation based on the docs but the form submits even if the fields are empty.

import z from "zod";

export const AuthSchema = z.object({
  email: z.string(),
  password: z.string(),
});

export type AuthForm = z.infer<typeof AuthSchema>;

  const [authForm, { Form, Field }] = createForm<AuthForm>({
    validate: zodForm(AuthSchema),
  });

  const handleSubmit: SubmitHandler<AuthForm> = async (item) =>
    await onSubmit(item);

[Fabian Hiller]

An empty field will return an empty string. Therefore, your form will always conform to your schema. Here is a fix:

const AuthSchema = v.object({
  email: v.string()
    .min(1, 'Please enter your email.')
    .email('The email address is badly formatted.'),
  password: v.string()
    .min(1, 'Please enter your password.')
    .min(8, 'Your password must have 8 characters or more.'),
});

[Blaise Tiong]

An empty field will return an empty string. Therefore, your form will always conform to your schema. Here is a fix:

const AuthSchema = v.object({

  email: v.string()

    .min(1, 'Please enter your email.')

    .email('The email address is badly formatted.'),

  password: v.string()

    .min(1, 'Please enter your password.')

    .min(8, 'Your password must have 8 characters or more.'),

});

I see, this seems different from how Zod works with react hook forms. Thanks for the feedback