javascriptdebugginggraphqlresolver

How do I debug a GraphQL resolver in JavaScript?


I'm following a tutorial on howtographql.com, which creates a very basic GraphQL server with in-memory data and resolvers written in JavaScript. I keep having issues where I'd like to be able to just put a breakpoint in the resolver, but when I'm running the GraphQL playground GUI, I can't see anything in the DevTools' Sources panel, and putting a debugger line in the code doesn't stop it either.

How do I debug my resolver?

Schema

type Mutation {
  updateLink(id: ID!, url: String, description: String): Link
}

Resolver (I'm using immutable.js's Map; perhaps not correctly)

let links = [
  {
    id: "link-0",
    url: "www.howtographql.com",
    description: "Fullstack tutorial for GraphQL",
  },
]

const resolvers = {
  Mutation: {
    updateLink(root, args) {
      const linkIndex = links.findIndex(link => link.id === args.id);
      const state = links.map(link => {
        debugger;
        if (link.id === args.id) {
          const map = Map(link);
          return map
            .set("url", args.url || link.url)
            .set("description", args.description || link.description);
        }
        return link;
      });
      links = state;
      return state[linkIndex];
    },
}

Solution

  • The resolvers run on the server. The servers' code will not appear in DevTools' Sources panel. You have to use a NodeJS debugger from your IDE to debug your resolvers