`createQuestionSchema` seems not working (tutorial)

[exKAZUu]

What is the problem?

The tutorial shows the following code, but client validation seems not working.

// app/pages/questions/validations.ts
import { CreateQuestion } from "app/questions/mutations/createQuestion"

export const createQuestionSchema = CreateQuestion

For example, if we change the definition of CreateQuestion as follows:

// app/questions/mutations/createQuestion.ts
export const CreateQuestion = z.object({
  text: z.string().email(),
  choices: z.array(z.object({text: z.string()})),
})

I expect we cannot enter a non-email string in a question text, but we can do and we will get the following error from a SERVER (not a client).

If we move the definition of CreateQuestion from app/questions/mutations/createQuestion.ts to app/pages/questions/validations.ts as follows, then client validation works well.

// app/pages/questions/validations.ts
export const CreateQuestion = z.object({
  text: z.string().email(),
  choices: z.array(z.object({text: z.string()})),
})

// app/questions/mutations/createQuestion.ts
import { CreateQuestion } from "../../pages/questions/validations";

Paste all your error logs here:

Please see the above screenshot.

Paste all relevant code snippets here:

Please see the above code snippets.

What are detailed steps to reproduce this?

1. Follow the tutorial (https://blitzjs.com/docs/tutorial)
2. Change the definition of CreateQuestion (text: z.string() -> text: z.string().email())
3. Enter a non-email string in the question text
4. Client validation doesn't be triggered (SHOULD BE TRIGGERED)

Run blitz -v and paste the output here:

macOS Monterey | darwin-x64 | Node: v16.11.1

blitz: 0.42.4 (local)

  Package manager: yarn
  System:
    OS: macOS 12.0.1
    CPU: (8) x64 Intel(R) Core(TM) i7-1068NG7 CPU @ 2.30GHz
    Memory: 26.34 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.11.1 - /private/var/folders/tj/9535q_6j1h55lgqwzlgg1mwc0000gn/T/xfs-5e9be5e5/node
    Yarn: 3.1.0 - /private/var/folders/tj/9535q_6j1h55lgqwzlgg1mwc0000gn/T/xfs-5e9be5e5/yarn
    npm: 8.0.0 - ~/.asdf/plugins/nodejs/shims/npm
    Watchman: 2021.10.18.00 - /usr/local/bin/watchman
  npmPackages:
    @prisma/client: 3.5.0 => 3.5.0
    blitz: 0.42.4 => 0.42.4
    prisma: 3.5.0 => 3.5.0
    react: 18.0.0-alpha-5ca4b0433-20211020 => 18.0.0-alpha-5ca4b0433-20211020
    react-dom: 18.0.0-alpha-5ca4b0433-20211020 => 18.0.0-alpha-5ca4b0433-20211020
    typescript: ~4.4 => 4.4.4

Please include below any other applicable logs and screenshots that show your problem:

Please see the above screenshot.

[exKAZUu]

I have another but a related question. Since the file path of the auth validation is app/auth/validations.ts, I suspect we should move validation.ts from app/pages/questions/validations.ts to app/questions/validations.ts. (Actually, I tried, but the behavior didn't change)

[beerose]

Hey! Thanks for reporting this.

As for the first question — yes, the validators don't work when exported from mutations/ or queries/ folders. That's because code in those folders can only run on the server, and secondary imports are undefined on the frontend. Here's more: https://github.com/blitz-js/blitz/issues/2754. That's why it's necessary to move it to a separate file: https://blitzjs.com/docs/tutorial#adding-choices-to-the-question-form (but that code doesn't seem to work either?)

Since we already have the issue for the secondary imports problem, one thing that we should do is update the tutorial. I'll move this issue to our docs repo.

As for the second question — the location shouldn't matter — once the code in the validations.ts is correct it should be fine. However, we can unify it and have it in a similar way as for auth. That also requires a change in the tutorial.

We also have this issue: https://github.com/blitz-js/blitz/issues/2815 to put validators in a separate file out of the box.

[exKAZUu]

Thank you for the explanation, I understand :bow: I also feel it's good to mention about import statements for mutations/ or queries/ in the tutorial (though I understand maintaining documents is a hard task.)

[beerose]

Yeah, we can definitely mention it!

[JuanM04]

@exKAZUu I added a mention here 38044d2. If that solves it, feel free to close this issue