Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
4 of 7 tasks
Vainonen opened this issue Apr 7, 2021 · 5 comments
Open
4 of 7 tasks

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

Vainonen opened this issue Apr 7, 2021 · 5 comments
Assignees
Labels
Milestone

Comments

@Vainonen
Copy link
Contributor

Vainonen commented Apr 7, 2021

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

  • malihu/malihu-custom-scrollbar-plugin (visible difference between jQuery 2.x and 3.x)
  • grimmlink/qtip2 (jQuery migration plugin warnings)
  • twitter/typeahead.js (jQuery migration plugin warnings)
  • twitter/bootstrap (jQuery migration plugin warnings)
  • etdsolutions/waypoints (jQuery migration plugin warnings)
  • vakata/jstree (jQuery migration plugin warnings)
  • 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/

@Vainonen Vainonen added this to the Next Tasks milestone Apr 7, 2021
@joelit joelit added the size-large more than 2 days label May 18, 2021
@joelit joelit self-assigned this May 18, 2021
@joelit joelit modified the milestones: Next Tasks, 2.11 Jun 2, 2021
@joelit joelit modified the milestones: 2.11, 2.12 Jun 2, 2021
@osma osma modified the milestones: 2.12, 2.13 Nov 2, 2021
@miguelvaara miguelvaara modified the milestones: 2.13, Next Tasks Dec 8, 2021
@osma
Copy link
Member

osma commented Mar 31, 2022

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

@kinow
Copy link
Collaborator

kinow commented Apr 10, 2022

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.

image

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
Copy link
Collaborator

kinow commented Apr 10, 2022

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

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 🤞

@kinow
Copy link
Collaborator

kinow commented Apr 10, 2022

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 :-) 🎉 Even the scrollbar listener is working OK.

@osma
Copy link
Member

osma commented Sep 16, 2022

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.

@osma osma mentioned this issue Sep 16, 2022
4 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

5 participants