Make validators accept ZodEffects to handle refined schemas

[esafak]

I just copied the current definition of validators from sveltekit-superform

Fixes #45

[changeset-bot]

🦋 Changeset detected

Latest commit: eaf4f75

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
formsnap	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
formsnap	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 19, 2023 3:06am

[huntabyte]

Thanks for this! @esafak

[esafak]

I fear this might not have fixed it. Apologies for not testing carefully. I'll take another look.

[huntabyte]

It fixed another discrepancy though! I think I know why this is happening @esafak, but I'm not 100% sure of how to resolve it elegantly. It's with the ZodValidation<AnyZodObject> generic type on the form.svelte component. I can try to look into it further later today if you aren't able to find anything before then!

[esafak]

Please do, you know your library best. A unit test for this case would be welcome. Also, this is recognized as a bug in Zod:

colinhacks/zod/issues/2474
colinhacks/zod/issues/2646

[BenocxX]

Is the issue #45 fixed?

Thanks for the work :)

[BenocxX]

I confirm that the fix did not work. I still get an error message when I pass config to <Form.Field>.

[esafak]

I confirm that the fix did not work. I still get an error message when I pass config to <Form.Field>.

Can you try #52 ?

[BenocxX]

How can I try the new version in my existing project? Can I tell my package.json to use a specific branch for FormSnap?

[esafak]

Remove your existing formsnap, and install from https://github.com/esafak/formsnap/tree/refine: https://stackoverflow.com/questions/17509669/how-to-install-an-npm-package-from-github-directly

That is not how I did it, though. I cloned it installed it using (p)npm link: https://docs.npmjs.com/cli/v9/commands/npm-link

But the first way should be easier.

[BenocxX]

It seems to be working as expected! I have a refine on the schema, everything works and no TS error.

Thanks a lot for the fix, I really needed this!

Though, I found an other problem related to refine. When having more complex rules for fields (coerce and nativeEnum), the refine isn't called if they fail. This issue might be related to Zod more than FormSnap though.

Here's the schema:

export const registerSchema = z
  .object({
    email: z.string().email(),
    password: z.string().min(8),
    confirmPassword: z.string(),
    firstName: z.string().min(1),
    lastName: z.string().min(1),
    gender: z.nativeEnum(Gender), // If fails validation, stops the refine from being executed
    birthDate: z.coerce.date(), // If fails validation, stops the refine from being executed
  })
  .refine((data) => data.confirmPassword === data.password, {
    message: 'Passwords do not match',
    path: ['confirmPassword'],
  });

[esafak]

Do these apply? colinhacks/zod#479 colinhacks/zod#2524

…

On Fri, Sep 29, 2023 at 8:35 PM Mathis Côté ***@***.***> wrote: It seems to be working as expected! I have a refine on the schema, everything works and no TS error. Thanks a lot for the fix, I really needed this! Though, I found an other problem related to refine. When having more complex rules for fields (coerce and nativeEnum), the refine isn't called if they fail. This issue might be related to Zod more than FormSnap though. Here's the schema: export const registerSchema = z .object({ email: z.string().email(), password: z.string().min(8), confirmPassword: z.string(), firstName: z.string().min(1), lastName: z.string().min(1), gender: z.nativeEnum(Gender), // If invalid, stop the refine from being executed birthDate: z.coerce.date(), // If invalid, stop the refine from being executed }) .refine((data) => data.confirmPassword === data.password, { message: 'Passwords do not match', path: ['confirmPassword'], }); — Reply to this email directly, view it on GitHub <#47 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AA57B3HWGOEH2SRN2Y2NVJLX46HPLANCNFSM6AAAAAA45TUVZQ> . You are receiving this because you were mentioned.Message ID: ***@***.***>

[BenocxX]

Yeah it seems to be the same issue. Ergh sadly it doesn't look like the Zod devs will be fixing it anytime soon...

Thanks for the help!

[wellitonscheer]

hi, i did this just to try and it looks fine.

import { z } from "zod";
import { validateVal } from "packages/utils/validateVal";

const val = z.string().refine(
  (val) => {
    return validateVal(val);
  },
  { message: "Invalid val" }
);

export const MySchema = z.object({
  id: z.string(),
  name: z.string(),
  val: val,
});
export type MyType = z.infer<typeof MySchema>;

i have no idea if its perfect but its working for now.
tell me if didnt work for you guys, it will be useful for me too.