I just got this message in my web inspector:
'You're relying on undocumented functionality where Canvas makes jQueryUI widgets out of rich content that has the following class names: .dialogue, .draggable, .resizable, .sortable, .accordion, .tabs.
I am really just wondering if anybody knows what is going on because our style guide has not yet been updated to reflect this change. We are using accordions in many places and if Canvas deprecates this functionality is going to break a lot of our materials. Thus I want to get out in front of this as quickly as possible. It sounds like Canvas is going to be using their own widgets. Will we still have access to those? If so when can we expect the style guide to be updated?
Any insight into this matter would be appreciated.
A solution was found. Canvas suggests that institutions stop using Jquery UI and instead include their own custom code for such things.
Solved! Go to Solution.
Hey everybody, this is Ryan Shaw, from the canvas engineering team. I see a lot of great questions here and some worry so I wanted to chime in to provide some guidance and assurance.
First, sometimes the markup that gets created from people doing this in their content is not accessible. So, for example, users using a screenreader would not be able to use that content. That’s a huge bummer for them so we wanted to make sure we weren’t contributing to that.
Second, we are starting to rely on React.JS more and more in our front-end code, and we have even written our own UI library (http://instructure.github.io/instructure-ui/) that is built on React and is much more modern, has better UX, fixes a ton of bugs that would pop up with jqueryUI widgets and, has some of the best accessibility support of any UI lib I’ve ever seen. So we have started replacing places we were using jQueryUI widgets to use instructure-ui widgets and using the latter exclusively for new code.
As far as when will canvas stop using jqueryUI anywhere, I’ll be the first to tell you that it will take a long while...like measured in years, not months. And as long as we are loading jQueryUI widgets for something we need on the page, there’s no reason not to expose it like this for you to use too.
So the “official” future-proof, encouraged way of adding your own widgets is to include your own UI library in your custom JS file so it is not dependent on anything from canvas’ code. (On a side note, if you are going to do that, make sure that you are using a library that has good accessibility support, there are a lot out there that look nice but are unusable by screenreaders)
I hope that helps clear up some of the what, why, and when behind this question. I love reading these forums, you guys are so innovative, so helpful to each other and your passion to create great educational content shows!
@jnickerson1 Thank Youfor staying on top of this! Is this as catastrophic as it sounds? There was such interest in https://community.canvaslms.com/groups/designers/blog/2015/07/01/using-jquery-without-custom-javascr... that I think at this point there is probably a lot of content out there built off this framework. Is this something we should be sounding the alarm about more broadly? Do you think we should be trying to update all the community resources with this latest information? Do you think Canvas could do anything to help address this? I'm concerned but not 100% sure yet how concerned I should be...
It would be GREAT if Canvas continued to support this as a feature for users even if they are not using the scripts themselves, but I guess maybe that too much overhead for them. I was really excited about using this more, but now I am hesitant since I'm not sure if I would have any support at my school for installing and maintaining the script support locally.
I would say it is possible that for some institutions and some teachers this is going to be fairly catastrophic. I am not affiliated with canvas, so I cannot speak on their behalf. However, when I first discovered this, to say I was alarmed would be an understatement because we were using these widgets a lot in our materials.
I do personally believe it is something that Instructure should be sounding the alarm about more broadly. I am somewhat surprised that they are not giving people more warning. Indeed the current warning is quite subtle and if you're not staring at your console all the time it could easily be missed.
After discussing this on the phone with some Canvas representatives they confirmed they are deprecating. They did not offer a timeframe but did say it would be a while yet (I don't know if that means months? years?). But it was decided that the best course of action would be for us to redo our courses using our own scripts. Lucky for us, our organization hasn't been using Canvas very long so we were able to quickly go back and redo all of our materials.
The positive side of this is that, IMO, the "widgets" that I built myself actually function better and are more performant than the jQuery UI "widgets". We also have more control over how they behave and how they are styled now. So although it was a little more work upfront, we are actually much happier with the end result.
I should mention that I do find it peculiar that Canvas is still showing these on every institution's style guide. In fact I find it peculiar that they even have these style guides associated with each institution. The reason I feel this way is that when I asked them about it during one of our phone conversations the response was that the style guide is only for Canvas developers, not for content creators. So it remains a mystery why they would even have an institution level style guide if it is not meant to be used.
Although I do find the style guide useful because we still take advantage of other things that are NOT being deprecated such as the Flexbox Grid.
Thank you, erinhallmark! Can we get a translation for us mere mortals? One of the reasons the tabs and accordions are so nice is that we don't have to be sysadmins or programmers to use them. I'm not sure what this means:
I'm about to embark on a content development project for Fall (I just started it this weekend in fact), and it sounds like I probably should not use the tabs and accordions unless I can get my Canvas admin to do something, but I don't know what I would ask him to do (and I'm hesitant also... this is not the kind of support request they probably want to get...). Any additional information would be much appreciated — thank you!
Thanks for keeping an eye out Erin. However, the switch from RequireJS to Webpack is unrelated to this discussion.
Although a common misconception, jQuery is not the same thing as jQuery UI.
To clarify: Canvas will continue to use jQuery (considered a necessity). Canvas will not continue to use jQuery UI (not considered a necessity).