Issues with the Canvas Live API

[wguida]

Hi All, 

Is anyone else having trouble accessing the drop-down menus on the Canvas Live API site? 

Whenever I try to expand one of the rows, I just get no response from the page. 

[James]

@wguida 

I don't use the Live API, but I went and checked. Yes, there is a problem with it.

If you open the Developer Tools console and reload the page, there are a bunch of warnings about missing Swagger information and there's an uncaught type error. That error stops any additional JavaScript in the file from running and so nothing seems to work.

[chriscas · Accepted solution]

Hi @wguida,

I have seen some chatter on this issue on a different chat platform, and one of my colleagues from UMich, Matt Jones, posted a temporary workaround there.  I'll paste it here:

---

Local override method:

• Browse to /doc/api/live (where the page will be broken)
• Open developer tools (right click inspect or more tools menu), go to Sources tab.
• Ctrl-O or ⌘-O and search for swagger.js
• Right click and Override content, choose a location to save
• Modify line around 510 from

this.isCollection = this.dataType && (this.dataType.toLowerCase() === 'array' || this.dataType.toLowerCase() === 'list' || this.dataType.toLowerCase() === 'set');

to

this.isCollection = Array.isArray(this.dataType) ? true : this.dataType && ['array', 'list', 'set'].includes(this.dataType.toLowerCase());

Refresh.

---

Someone else there was informed by Canvas support that an official fix is scheduled to go to production on Feb 26.

I hope this info helps!

-Chris

[James]

@chriscas, thanks for providing the solution.

I didn't actually check it, but I'm pretty sure my code linter would complain about ternary operators not being needed (that's not the exact message it would give). Basically, it complains anytime I put a true or false in a check like this, so I'm sure it would here.

Here are a couple of alternatives (I think the second one is cleaner).

this.isCollection = Array.isArray(this.dataType) || (this.dataType && ['array', 'list', 'set'].includes(this.dataType.toLowerCase()));
this.isCollection = this.dataType && (Array.isArray(this.dataType) || ['array', 'list', 'set'].includes(this.dataType.toLowerCase()));

[wguida]

Thank you, @chriscas and @James !