Tutorial: server validation

Get Help and Help Others
1

I’m on Saving Data | Learn RedwoodJS and I don’t get the error rendered nicely at the email field like the example: https://user-images.githubusercontent.com/300/80259553-c46e2780-863a-11ea-9441-54a9112b9ce5.png

I get this:
image

(Shortly followed by the page disappearing and being replaced by the full screen error handler).

Pretty sure I followed the steps - what am I doing wrong?

2

In fact, I used the code from " Here’s the final ContactForm.js page" and still had the issue.

Also worth noting that code doesn’t include the client-side email validation…

3

Hey @insomniacity,

Could you share that error message with us? We recently upgraded react-hook-form and it could be related.

4

From the console:

Uncaught (in promise) Error: GraphQL error: Can't create new contact
    ApolloError bundle.esm.js:63
    next bundle.esm.js:1004
    notifySubscription Observable.js:135
    onNotify Observable.js:179
    next Observable.js:235
    next bundle.esm.js:866
    next bundle.esm.js:866
    notifySubscription Observable.js:135
    onNotify Observable.js:179
    next Observable.js:235
    next bundle.esm.js:29
    notifySubscription Observable.js:135
    onNotify Observable.js:179
    next Observable.js:235
    createHttpLink bundle.esm.js:76
    promise callback*createHttpLink/</< bundle.esm.js:75
    Subscription Observable.js:197
    subscribe Observable.js:279
    onError bundle.esm.js:11
    Subscription Observable.js:197
    subscribe Observable.js:279
    multiplex bundle.esm.js:864
    Subscription Observable.js:197
    subscribe Observable.js:279
    mutate bundle.esm.js:1001
    mutate bundle.esm.js:998
    step tslib.es6.js:100
    verb tslib.es6.js:81
    __awaiter tslib.es6.js:74
    __awaiter tslib.es6.js:70
    mutate bundle.esm.js:950
    mutate bundle.esm.js:2016
    node_modules app.chunk.js:713
    runMutation react-hooks.esm.js:419
    onSubmit ContactPage.js:33
    onSubmit index.js:184
    handleSubmit index.esm.js:1124
    React 17
    unstable_runWithPriority scheduler.development.js:653
    React 15
    unstable_runWithPriority scheduler.development.js:653
    React 6
    _callee$ page-loader.js:99
    Babel 10

The HTTP response is the expected UserInputError

5

Do you know which version of Redwood you’re using? The command yarn rw info will show you if needed.

v0.17 is now at v0.17.2 due to a Prisma related bug (Prisma Client is the db object). And there’s now an additional Prisma patch release we’ve not yet included in a Redwood release. So there’s a chance this is related. However, I would have expected it to show up earlier in the Tutorial if so :thinking:

6 
  System:
    OS: Windows 10 10.0.19041
  Binaries:
    Node: 12.18.3 - ~\AppData\Local\Temp\yarn--1599395439779-0.33680748927915904\node.CMD
    Yarn: 1.22.5 - ~\AppData\Local\Temp\yarn--1599395439779-0.33680748927915904\yarn.CMD
  Browsers:
    Chrome: 85.0.4183.83
    Edge: Spartan (44.19041.423.0), Chromium (85.0.564.44)
  npmPackages:
    @redwoodjs/core: ^0.17.2 => 0.17.2
7

Thank you for sharing that.

Sorry I don’t have more time to dig in now. Here’s my example repo of the finished Tutorial Blog Project. You could check your code against this repo if interested:

We’ll try to look deeper next week.