Using GraphQL to View All Module Items

[jpinto]

After  @wdransfield ‌'s excellent Canvas Developer Session at INSTCON19 I was inspired to try out GraphQL and see whether we can simplify / speed up our API-based integrations. 

We're creating a tool to allow us to quickly assess whether our courses are ready to be published. I'd like to make sure that every module contains a page that starts with "Overview".

I can quite easily pull a list of all modules and the moduleitem IDs for each. It works very well - far easier than combining many API calls.

query MyQuery {
  course(id: 738) {
    name
    modulesConnection {
      nodes {
        moduleItems {
          _id
        }
        name
      }
    }
  }
}‍‍‍‍‍‍‍‍‍‍‍‍‍

If I try to go any further - for example - pull the titles of each Page - the script fails. Attempts to use the "content" attribute fail reliably.

query MyQuery {
  course(id: 738) {
    name
    modulesConnection {
      nodes {
        moduleItems {
          _id
          content {
            ... on Page {
              title
              _id
            }
          }
        }
        name
      }
    }
  }
}‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Message: 

Error: Request failed with status code 500
at LYNF.e.exports (https://du11hjcvx0uqb.cloudfront.net/br/dist/webpack-production/main-e-154b446262.js:1693:37)
at Rn+g.e.exports (https://du11hjcvx0uqb.cloudfront.net/br/dist/webpack-production/main-e-154b446262.js:1984:29)
at XMLHttpRequest.h.<computed> (https://du11hjcvx0uqb.cloudfront.net/br/dist/webpack-production/main-e-154b446262.js:7382:1)

Is the content attribute not yet production-ready?

Thanks!

[James]

 @jpinto ,

That was the session I wanted to get into but they closed the doors as I was getting there. I'm anxiously awaiting that video.

I pasted your code into my graphiql and changed the course ID to one of my courses and it worked. 

Since Canvas has announced that GraphQL is the future of API, I need to learn this stuff. Thank you for providing some real working applications. I was getting a similar error with some of the stuff I was trying last night so it was good to get something that actually worked.

I don't doubt that you're getting the error, though, as I'm able to get it with a different request by including content.

This works.

query MyQuery {
  allCourses {
    modulesConnection {
      nodes {
        name
        moduleItems {
          _id
        }
      }
    }
  }
}
‍‍‍‍‍‍‍‍‍‍‍‍

Adding the content doesn't.

query MyQuery {
  allCourses {
    modulesConnection {
      nodes {
        name
        moduleItems {
          _id
          content {
            ... on Page {
              title
            }
          }
        }
      }
    }
  }
}
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

It generates the same error you got.

Error: Request failed with status code 500
    at LYNF.e.exports (https://du11hjcvx0uqb.cloudfront.net/br/dist/webpack-production/main-e-154b446262.js:1693:37)
    at Rn+g.e.exports (https://du11hjcvx0uqb.cloudfront.net/br/dist/webpack-production/main-e-154b446262.js:1984:29)
    at XMLHttpRequest.h.<computed> (https://du11hjcvx0uqb.cloudfront.net/br/dist/webpack-production/main-e-154b446262.js:7382:1)‍‍‍‍

[jpinto]

Thanks James (also thanks for all the excellent Canvancements).

So we're seeing the same behaviour. While it's clear that GraphQL is the future of the API I'm curious to understand better how ready it is. 

Not sure you saw this, but Weston shared the slides for his presentation in the hack night discussion forum: Developer Session - Google Slides. Hope that holds you over until the video is up.

[James]

Thanks, I downloaded the slideshow within minutes of him posting it.  It didn't really show much about graphql that was helpful, which is why I'm waiting on the video. I talked a little with (I think) Cameron Matthews at hack night and he showed me some things (about 3 minutes worth).

According to the engineering team, GraphQL is ready for use now. If something doesn't work that you really need, it might be worth filing a ticket.

My take is a little different. I think the graphql that Canvas actually uses for their processes is ready. I'm not so sure about the stuff they're adding because they can.

[jpinto]

Update from our CSM:

The team just merged a fix for the error you're seeing. It will go out in the next release. They also said we're using it in production and that module items are a recent addition but overall you should feel free to use it. 

[James]

Thanks for the update. It's always nice when people think to come back and share.