Search code examples
reactjsapolloreact-apolloprisma

React + Apollo "Getting Started" Error in Prisma Playground


I am in the Getting Started React + Apollo chapter: https://www.howtographql.com/react-apollo/1-getting-started/

When I enter the following query in the Prisma Playground (as the tutorial tells me to do):

mutation CreatePrismaLink {
  post(
    description: "Prisma gives you a powerful database toolkit 😎"
    url: "https://prisma.io"
  ) {
    id
  }
}

mutation CreateApolloLink {
  post(
    description: "The best GraphQL client for React"
    url: "https://www.apollographql.com/docs/react/"
  ) {
    id
  }
} 

I get this error message that I don't understand. It seems to be something about the server

  "errors": [
    {
      "message": "Argument id for data.postedBy.connect.id must not be null. Please use undefined instead.\n",
      "locations": [
        {
          "line": 2,
          "column": 3
        }
      ],
      "path": [
        "post"
      ],
      "extensions": {
        "code": "INTERNAL_SERVER_ERROR",
        "exception": {
          "clientVersion": "2.12.1",
          "stacktrace": [
            "Error: Argument id for data.postedBy.connect.id must not be null. Please use undefined instead.",
            "",
            "    at Document.validate (C:\\Users\\shanm\\hackernews-react-apollo\\server\\node_modules\\@prisma\\client\\runtime\\index.js:77413:19)",
            "    at NewPrismaClient._executeRequest (C:\\Users\\shanm\\hackernews-react-apollo\\server\\node_modules\\@prisma\\client\\runtime\\index.js:79065:17)",
            "    at C:\\Users\\shanm\\hackernews-react-apollo\\server\\node_modules\\@prisma\\client\\runtime\\index.js:79002:52",
            "    at AsyncResource.runInAsyncScope (async_hooks.js:197:9)",
            "    at NewPrismaClient._request (C:\\Users\\shanm\\hackernews-react-apollo\\server\\node_modules\\@prisma\\client\\runtime\\index.js:79002:25)",
            "    at Object.then (C:\\Users\\shanm\\hackernews-react-apollo\\server\\node_modules\\@prisma\\client\\runtime\\index.js:79119:39)",
            "    at processTicksAndRejections (internal/process/task_queues.js:93:5)"
          ]
        }
      }
    }
  ],
  "data": null
}

please help me find the problem?


Solution

  • This is old but in case somebody else hits this issue and Googles it like me:

    Unfortunately the answer here didn't work for me, but the solution is something that was covered in the Node+GraphQL tutorial, which you might not be able to figure out on your own:

    In order to post you have to first create a user and then be authorized as that user. The mutation to create a user is listed as an example on the page, but unfortunately the author forgot to instruct the reader to run it before trying to create a post.

    1. Paste this into the playground to create a user
    mutation {
      signup(name: "Sarah", email: "sarah@prisma.io", password: "graphql") {
        token
        user {
          id
        }
      }
    }
    
    1. Copy the token that is returned

    2. Open the "HTTP Headers" pane in the bottom left

    3. Enter this with your token:

    {
      "Authorization": "Bearer TOKEN_HERE"
    }
    
    1. Now you can run the mutations to create the posts