Develop Javascript / GraphQL on Test Instance?

[DanielLim]

Is there an easy way to write Javascript code that accesses the GraphQL API that will sit on top of the Canvas LMS?

Our staff are having issues with the way grades are handled in Canvas. They want to see semester grades based on two quarter grades but it seems this is not possible. I thought it would be nice to have a javascript panel (like a navbar) slide in to display the relevant grades the way our staff want it. To do this I think I'd need to pull all the grades for the relevant course through the GraphQL API, do some calculations then simply present the numbers on the panel.

I have programming experience, but very little experience with web browser programming. Any ideas / help would be greatly appreciated!

[jerry_nguyen]

@DanielLim 

I've written a custom Javascript to pull data from GraphQL and display on Canvas. You can use my script here as a starting point: https://community.canvaslms.com/t5/Canvas-Developers-Group/Custom-JS-to-display-full-sortable-To-Do-...

[DanielLim]

Thank you @jerry_nguyen !

I will take a look at your code - especially the way you connect to the GraphQL API.

A couple more really basic questions:

1. Where should I put your code in canvas to see how it works?
2. Should I go to 'Themes' -> 'Open in Theme Editor' -> 'Upload' and modify the existing Javascript file?
3. Do I need to ask my CSM to give me permission to do this?

[jerry_nguyen · Accepted solution]

@DanielLim 

1. You should test the code in the beta/test environment of your Canvas instance: https://community.canvaslms.com/t5/Canvas-Releases/What-is-the-Canvas-beta-environment/ta-p/255260

2. Yes, that's where you need to go to upload custom Javascript and CSS https://community.canvaslms.com/t5/Admin-Guide/How-do-I-upload-custom-JavaScript-and-CSS-files-to-an...

3. If you have Admin access to Canvas then you can upload the code to "Themes"