Thu23Jun2016
Information
Print

How to update old jQuery scripts for compatibility with jQuery 3

Information
jQuery jQuery Easy jQuery Easy Profiles
First published June 23, 2016
17963 hits -
 

jQuery v3.0 is considered the future of jQuery. It is a lighter, faster version and removes support to IE6-8 (like the previous 2.x branch).

Old scripts built for earlier versions of jQuery may 'break', but thankfully, the jQuery team has provided the Migrate plugin to help identify compatibility issues.

It is not possible to directly update old scripts with Migrate v3.0.0 alone (it does not support all accumulated changes made since jQuery v1.6), therefore the migration will have to be performed in a few steps.

Using jQuery Easy or jQuery Easy Profiles makes the process a little easier.

Step 0 Open the jQuery Easy system plugin (or a jQuery Easy Profiles module instance), go to the basic options and enable jQuery.

Step 1 Select the latest 1.12.x or 2.2.x version of jQuery (check which sub-versions are available at the Google CDN).

jQuery selection

Step 2 Select the version 1.4.1 of jQuery Migrate.

jQuery Migrate selection

Step 3 Set the compression to 'uncompressed', which will make the Migrate plugin verbose (it will diagnose issues and report them by generating warnings instead of restoring deprecated features and behaviors).

Javascript compression

Step 4 Open the browser's console and fix any problems in your scripts identified in the console by the Migrate warning messages (starting with JQMIGRATE). Check the list provided by the jQuery team to find out how the incompatibility can be solved. You may not have any warning, in which case the scripts do not require any modifications!

Browser console with Migrate logs

Step 5 Disable the Migrate plugin (set Migrate to 'none') and make sure the pages still work properly without it.

jQuery Migrate selection

Step 6 Select the latest jQuery 3.0.x version.

jQuery selection

Step 7 Select Migrate 3.0.0.

jQuery Migrate selection

Step 8 Check the browser's console and fix any problems in your scripts identified in the console with JQMIGRATE. Check the master list provided by the jQuery team to find out how to replace the deprecated feature. You may not have any warning!

Browser console with Migrate logs

Step 9 Disable the Migrate plugin (set Migrate to 'none') and make sure the page still works properly without it.

jQuery Migrate selection

Note Using Migrate v3.0.0 in conjunction with jQuery v3.0.x will also ensure oldest versions of jQuery UI and Mobile remain fully operational.

Useful links