Choosing the right schema validation framework

Get Help and Help Others
1

Hey dear Community,

Could use some help choosing a schema validation framework for our project.

RedwoodJS uses react-hook-forms, which lists the following: Yup, Zod, Joi, Superstruct, Vest

I’ve narrowed it down to :

  • yup - it has support for i18n
  • superstruct - feels like it has everything one would expect from such tool
  • vestjs - close to jest

But I’m still not sure how they compare to one another and if any is a clear leader in the field.

Would appreciate feedback and advice anyone would have.

2

One of the more complex form inputs we have is our email input.
There are specifically two features that stand out, that I’d use as a litmus test for any validation framework.

  1. It sends the email, as it’s typed, to the backend for validation/verification against blacklists. So it’s async. It also doesn’t start sending the email to the backend until it’s a valid email according to very basic front-end rules (needs to include @ and .tld basically), or until the user tries to submit the form. After any of those have happened it continuously sends to the backend (debounced).
  2. It looks at the email and suggests corrections for basic typos “name@gmil.com” → “Did you mean name@gmail.com?” where the suggestion is clickable to change the form input to that value instead. It’s just a suggestion (shown in yellow instad of red) and won’t prevent submitting the form, and is also dismissible by clicking on a “x”.

Any validation framework should support, or at least not be in the way of implementing, those two features.

1 Like
3

I wish I knew more about all these valiation frameworks. I only learned about vest on the changelog a few weeks ago - Playing it close to the Vest with Evyatar Alush (JS Party #213) |> Changelog

They do discuss it at length in the podcast. Maybe worth a listen. IIRC vest does both server and client side validations

4

Another option that I am using more now are GraphQL Scalars https://www.graphql-scalars.dev that do input validation such as email address or positive int or RGB color, etc.

You can add custom scalars to your GraphQL handler.

See: GraphQL | RedwoodJS Docs

You can also write your own scalars for validation – something I’ll write up as I am currently writing one to rework the roles support in Redwood so you can di something like:

  type Query {
    randomMovie: Movie! @requireAuth(roles: ["player", "visitor"]) // <-- an array of strings
    createGame: Game! @requireAuth(roles: "admin") // <-- a string
  }

A custom scalar here allows a string or an array of strings.

While this is used in a directive, the same principles apply to an Input or even the result data.