GraphQL Validation error on Cells and Scaffold generator

[ninoM]

Getting errors like Cannot query field "posts" on type "Query".GraphQL: Validation and Unknown type "Int".GraphQL: Validation

So I was follow the tutorial on the Redwood site and I reached the Getting Dynamic part of the tutorial. When I ran yarn rw g scaffold post and it did generate the file fine and it's even working functionality wise. But when I head over to the web/src/components/Post/ and open the cell files, I'm getting an error on all the gql queries and mutation.

web/src/components/Post/PostsCell/PostsCell.js

I proceeded with the tutorial thinking that it's just scaffold that this happens to but in the next part of the tutorial Our First Cell; running the command yarn rw g cell Articles and changing the articles to posts as per instructions, it still has the same error.

web/src/components/ArticlesCell/ArticlesCell.js

It's a bit of a minor thing (as it still works functionally) but it's annoying having all these red lines all over. Any way to fix this?

[thedavidprice]

@ninoM Thanks for this! What's happening here is not an error — it's that your types are out of sync and out of sync with VS Code. This isn't something obvious, so it makes sense for you to open this issue ✅

Here's how you'd resolve those SquigglesOfDeath™

1. update your RW types yarn rw g types (note: this happens each time you run dev server)
2. reload VS Code: I use the command palette shift+cmd+p then use "Developer: Reload Window" command

Looping in @cannikin What do you think about having a callout at this point giving these steps and explaining what happens? I remember the first time DT showed me what to do and it was a lifesaver in general.

[cannikin]

Hmm, it looks like @ninoM is running this as a JS project, not TS, so I wouldn't expect to see any type-related errors like this... what's the deal? Is this random de-sync of types something that's just going to happen forever, or is there something we can do to fix it? I don't remember this happening until fairly recently (and I'm in the same boat is @ninoM, I've just been ignoring it). If it's a permanent issue we should say something in the tutorial, but I think we'd all prefer they didn't get out of sync at all! 🥲

[thedavidprice]

Is this random de-sync of types something that's just going to happen forever, or is there something we can do to fix it?

This happens often to me with query types in Cells, exactly as @ninoM is describing. The generator should have updated types. I don't know why VS Code gets out of sync. I just know it requires a reload. Now that I'm in the habit of reloading I don't think about it.

If someone knew VS Code well, I'm sure they could help us resolve at the time types are refreshed. Well beyond my wheelhouse.

[cannikin]

But this'll happen even if it's a JS project? Seems weird to get type errors if you specifically aren't using Typescript!

[ninoM]

Hey @thedavidprice; I opened the project again just now and the ts errors are gone! So I'm guessing reloading the window as you suggested would work next time. Thanks!

But this'll happen even if it's a JS project? Seems weird to get type errors if you specifically aren't using Typescript!

@cannikin I found this StackOverflow post and it seems VSCode uses TS extension to power JS intellisense. This can be turned off using using

// put this line in settings.json
"javascript.validate.enable": false

but disables all syntax checking which isn't ideal. So solving the root cause of the desync would be preferred (or just add a note in tutorial for now; which I can open up a PR for this). Thanks!

[dthyresson]

Hi @ninoM a PR #4785 recently went it to help with some of these cases, but what I have found is that the GraphQL VSCode extensions sometimes doesn't pick up the latest and you need to force a reload:

And then this can resolve the "squiggles".

We think this might be due to this: https://github.com/graphql/graphiql/pull/2239/files#diff-0a11569aef8233cd6bd3df5a44b652b80ab68206d54e97c564f87fc3d0511bbdR59

[cannikin]

I can add a note to the tutorial, yeah. Do we have an official recommendation for solving? Restart the dev server, or restart VS Code? I don't love assuming everyone is running the same IDE, but maybe this is only a problem if you're using VS Code anyway?