Upgrading jQuery 2.x dependent libraries to support jQuery 3.x

[Vainonen]

In order to properly migrate to jQuery 3.x at least the following libraries need to be upgraded:

• [x] malihu/malihu-custom-scrollbar-plugin (visible difference between jQuery 2.x and 3.x)
• [x] grimmlink/qtip2 (jQuery migration plugin warnings)
• [ ] twitter/typeahead.js (jQuery migration plugin warnings)
• [x] twitter/bootstrap (jQuery migration plugin warnings)
• [ ] etdsolutions/waypoints (jQuery migration plugin warnings)
• [ ] vakata/jstree (jQuery migration plugin warnings)
• [x] components/jqueryui (jQuery migration plugin warnings)

Some of these "only" use deprecated features that are not per se dangerous and jQuery Migrate plugin (which restores old API) can be used in production for a while. See https://github.com/jquery/jquery-migrate/blob/main/warnings.md for more information.

Additional info: https://jquery.com/upgrade-guide/3.0/ and https://jquery.com/upgrade-guide/3.5/

[osma]

Bootstrap just got upgraded in PR #1182 so now it's one blocker less. :tada:

[kinow]

Had a look at some of the pending items of the list (excluding the first item):

• grimmlink/qtip2

Archived by maintainer. Easiest solution, IMO, is adopting Bootstrap's Popover (requires Popperjs only, no JQuery).

Update templates and docready.js to use the popover component instead. I think we should be able to customize the CSS, but not sure if it will look 100% like the current qtip popup (if it's a lot to customize, that could become an issue when upgrading to a new version of bootstrap too).

• twitter/typeahead.js

It hasn't been updated in a long time (last commit from 2015). We can review the warnings and keep using it, or search for a replacement component, or try the browser's Datalists. These are supported in Bootstrap, here's the caniuse for Datalists.

This solution with Datalists also is independent of JQuery. Not sure if we can customize how it looks like, I think it's more like the file & date pickers, that are handled by the browser.

• etdsolutions/waypoints

Hmm, last commit from 2015 too. Some users already reported problems with JQuery.

I think it is not very hard to write some JS code to handle the scrollbar events and fire a callback, as waypoint does. There is an event that we can try to use (not sure if it was available back in 2015, it looks like it's from 2020, but now well supported).

We could use JQuery, but I would first try a pure JS + DOM approach.

• vakata/jstree

This last one is still maintained, but by a single maintainer + pull requests. The maintainer appears to be busy with life/family/etc (which is good, and not his fault :) ).

We can try to take a look at the jstree's V4 staged work, and handle the warnings if needed. Or, we can search for an alternative library. This one I wouldn't try to write something in pure JS (I did write one for Cylc, but relied heavily on Vue.js API + reactivity).

WDYT?

[kinow]

Hmmm, JQuery UI also needs to be updated, I think? There are 3 CVE's against the current version we are using in Skosmos:

• https://github.com/advisories/GHSA-9gj3-hwp5-pmwc
• https://github.com/advisories/GHSA-j7qv-pgf6-hvh4
• https://github.com/advisories/GHSA-gpqq-952q-5327

The 1.13 release is pending from packagist. Someone created an issue in October/2021, but looks like there's no maintainer for the packagist component?

I couldn't find any ui- classes in our templates, nor .checkbox..., .tooltip calls in docready.js.

JQuery UI's [package.json for 1.12.1](https://github.com/jquery/jquery-ui/blob/1.12.1/package.json doesn't list JQuery as a dependency. But it contains JQuery 3.1 in its source directory. I think at least that version should work OK with JQuery UI, probably 3.6 too. 1.13.1 has "jquery": ">=1.8.0 <4.0.0" in package.json, so once that's released we should be good to use it with the latest JQuery :crossed_fingers:

[kinow]

Some of these "only" use deprecated features that are not per se dangerous and jQuery Migrate plugin (which restores old API) can be used in production for a while. See https://github.com/jquery/jquery-migrate/blob/main/warnings.md for more information.

Updated to JQuery 3 locally, re-created my dev environment on Docker, and so far everything is working OK :-) :tada: Even the scrollbar listener is working OK.

[osma]

I added components/jqueryui to the list. It's separate from jQuery and we're currently using jQuery UI 1.12. Version 1.13.2 is available (released in July 2022) and it should be compatible with jQuery 3.6. However, it is currently not available via Packagist / Composer, and the repo components/jqueryui is apparently not being maintained anymore.

Edit: Ah, I had missed @kinow's comment above mentioning jQuery UI as well.