Update jQuery to 3.7 and fix admintests (#5868)

* jQuery: Migrate to `.on()`, `.off()`, `.trigger()`

This avoids methods that are deprecated in newer versions of jQuery.

* jQuery: avoid `.removeAttr`, prefer `.prop`

* helper.edit: wait up to 10 seconds for ACCEPT_COMMIT

* Chat: disabled attribute is boolean

* Chat: avoid inline onclick handler to support jQuery 3.4+

* jQuery: update to version 3.6.0

* Update to 3.7

* Removed deprecated event.

* Revert change to focus on padeditor.ace

---------

Co-authored-by: webzwo0i <webzwo0i@c3d2.de>

src/static/js/ace2_inner.js

@@ -2585,17 +2585,17 @@ function Ace2Inner(editorInfo, cssManagers) {
           const firstEditbarElement = parent.parent.$('#editbar')
               .children('ul').first().children().first()
               .children().first().children().first();
-          $(this).blur();
-          firstEditbarElement.focus();
+          $(this).trigger('blur');
+          firstEditbarElement.trigger('focus');
           evt.preventDefault();
         }
         if (!specialHandled && type === 'keydown' &&
             altKey && keyCode === 67 &&
             padShortcutEnabled.altC) {
           // Alt c focuses on the Chat window
-          $(this).blur();
+          $(this).trigger('blur');
           parent.parent.chat.show();
-          parent.parent.$('#chatinput').focus();
+          parent.parent.$('#chatinput').trigger('focus');
           evt.preventDefault();
         }
         if (!specialHandled && type === 'keydown' &&

src/static/js/admin/jquery.autosize.js

@@ -164,7 +164,7 @@
 				$(window).resize(adjust);
 
 				// Allow for manual triggering if needed.
-				$ta.bind('autosize', adjust);
+				$ta.on('autosize', adjust);
 
 				// Call adjust in case the textarea already contains text.
 				adjust();

src/static/js/admin/plugins.js

@@ -112,15 +112,15 @@ $(document).ready(() => {
 
   const updateHandlers = () => {
     // Search
-    $('#search-query').unbind('keyup').keyup(() => {
+    $('#search-query').off('keyup').on('keyup', () => {
       search($('#search-query').val());
     });
 
     // Prevent form submit
-    $('#search-query').parent().bind('submit', () => false);
+    $('#search-query').parent().on('submit', () => false);
 
     // update & install
-    $('.do-install, .do-update').unbind('click').click(function (e) {
+    $('.do-install, .do-update').off('click').on('click', function (e) {
       const $row = $(e.target).closest('tr');
       const plugin = $row.data('plugin');
       if ($(this).hasClass('do-install')) {
@@ -134,7 +134,7 @@ $(document).ready(() => {
     });
 
     // uninstall
-    $('.do-uninstall').unbind('click').click((e) => {
+    $('.do-uninstall').off('click').on('click', (e) => {
       const $row = $(e.target).closest('tr');
       const pluginName = $row.data('plugin');
       socket.emit('uninstall', pluginName);
@@ -143,14 +143,14 @@ $(document).ready(() => {
     });
 
     // Sort
-    $('.sort.up').unbind('click').click(function () {
+    $('.sort.up').off('click').on('click', function () {
       search.sortBy = $(this).attr('data-label').toLowerCase();
       search.sortDir = false;
       search.offset = 0;
       search(search.searchTerm, search.results.length);
       search.results = [];
     });
-    $('.sort.down, .sort.none').unbind('click').click(function () {
+    $('.sort.down, .sort.none').off('click').on('click', function () {
       search.sortBy = $(this).attr('data-label').toLowerCase();
       search.sortDir = true;
       search.offset = 0;
@@ -164,7 +164,7 @@ $(document).ready(() => {
     if (data.query.offset === 0) search.results = [];
     search.messages.hide('nothing-found');
     search.messages.hide('fetching');
-    $('#search-query').removeAttr('disabled');
+    $('#search-query').prop('disabled', false);
 
     console.log('got search results', data);
 

src/static/js/admin/settings.js

@@ -25,7 +25,7 @@ $(document).ready(() => {
     /* Check to make sure the JSON is clean before proceeding */
     if (isJSONClean(settings.results)) {
       $('.settings').append(settings.results);
-      $('.settings').focus();
+      $('.settings').trigger('focus');
       $('.settings').autosize();
     } else {
       alert('Invalid JSON');
@@ -40,7 +40,7 @@ $(document).ready(() => {
       socket.emit('saveSettings', $('.settings').val());
     } else {
       alert('Invalid JSON');
-      $('.settings').focus();
+      $('.settings').trigger('focus');
     }
   });
 
@@ -62,7 +62,7 @@ const isJSONClean = (data) => {
   // this is a bit naive. In theory some key/value might contain the sequences ',]' or ',}'
   cleanSettings = cleanSettings.replace(',]', ']').replace(',}', '}');
   try {
-    return typeof jQuery.parseJSON(cleanSettings) === 'object';
+    return typeof JSON.parseJSON(cleanSettings) === 'object';
   } catch (e) {
     return false; // the JSON failed to be parsed
   }

src/static/js/broadcast_slider.js

@@ -67,7 +67,7 @@ const loadBroadcastSliderJS = (fireWhenAllScriptsAreLoaded) => {
       newSavedRevision.css(
           'left', (position * ($('#ui-slider-bar').width() - 2) / (sliderLength * 1.0)) - 1);
       $('#ui-slider-bar').append(newSavedRevision);
-      newSavedRevision.mouseup((evt) => {
+      newSavedRevision.on('mouseup', (evt) => {
         BroadcastSlider.setSliderPosition(position);
       });
       savedRevisions.push(newSavedRevision);
@@ -209,21 +209,21 @@ const loadBroadcastSliderJS = (fireWhenAllScriptsAreLoaded) => {
 
     // assign event handlers to html UI elements after page load
     fireWhenAllScriptsAreLoaded.push(() => {
-      $(document).keyup((e) => {
+      $(document).on('keyup', (e) => {
         if (!e) e = window.event;
         const code = e.keyCode || e.which;
 
         if (code === 37) { // left
           if (e.shiftKey) {
-            $('#leftstar').click();
+            $('#leftstar').trigger('click');
           } else {
-            $('#leftstep').click();
+            $('#leftstep').trigger('click');
           }
         } else if (code === 39) { // right
           if (e.shiftKey) {
-            $('#rightstar').click();
+            $('#rightstar').trigger('click');
           } else {
-            $('#rightstep').click();
+            $('#rightstep').trigger('click');
           }
         } else if (code === 32) { // spacebar
           $('#playpause_button_icon').trigger('click');
@@ -231,22 +231,22 @@ const loadBroadcastSliderJS = (fireWhenAllScriptsAreLoaded) => {
       });
 
       // Resize
-      $(window).resize(() => {
+      $(window).on('resize', () => {
         updateSliderElements();
       });
 
       // Slider click
-      $('#ui-slider-bar').mousedown((evt) => {
+      $('#ui-slider-bar').on('mousedown', (evt) => {
         $('#ui-slider-handle').css('left', (evt.clientX - $('#ui-slider-bar').offset().left));
         $('#ui-slider-handle').trigger(evt);
       });
 
       // Slider dragging
-      $('#ui-slider-handle').mousedown(function (evt) {
+      $('#ui-slider-handle').on('mousedown', function (evt) {
         this.startLoc = evt.clientX;
         this.currentLoc = parseInt($(this).css('left'));
         sliderActive = true;
-        $(document).mousemove((evt2) => {
+        $(document).on('mousemove', (evt2) => {
           $(this).css('pointer', 'move');
           let newloc = this.currentLoc + (evt2.clientX - this.startLoc);
           if (newloc < 0) newloc = 0;
@@ -257,9 +257,9 @@ const loadBroadcastSliderJS = (fireWhenAllScriptsAreLoaded) => {
           $(this).css('left', newloc);
           if (getSliderPosition() !== version) _callSliderCallbacks(version);
         });
-        $(document).mouseup((evt2) => {
-          $(document).unbind('mousemove');
-          $(document).unbind('mouseup');
+        $(document).on('mouseup', (evt2) => {
+          $(document).off('mousemove');
+          $(document).off('mouseup');
           sliderActive = false;
           let newloc = this.currentLoc + (evt2.clientX - this.startLoc);
           if (newloc < 0) newloc = 0;
@@ -276,12 +276,12 @@ const loadBroadcastSliderJS = (fireWhenAllScriptsAreLoaded) => {
       });
 
       // play/pause toggling
-      $('#playpause_button_icon').click((evt) => {
+      $('#playpause_button_icon').on('click', (evt) => {
         BroadcastSlider.playpause();
       });
 
       // next/prev saved revision and changeset
-      $('.stepper').click(function (evt) {
+      $('.stepper').on('click', function (evt) {
         switch ($(this).attr('id')) {
           case 'leftstep':
             setSliderPosition(getSliderPosition() - 1);

src/static/js/chat.js

@@ -42,11 +42,14 @@ exports.chat = (() => {
     },
     focus: () => {
       setTimeout(() => {
-        $('#chatinput').focus();
+        $('#chatinput').trigger('focus');
       }, 100);
     },
     // Make chat stick to right hand side of screen
     stickToScreen(fromInitialCall) {
+      if ($('#options-stickychat').prop('checked')) {
+        $('#options-stickychat').prop('checked', false);
+      }
       if (pad.settings.hideChat) {
         return;
       }
@@ -68,7 +71,7 @@ exports.chat = (() => {
         this.stickToScreen(true);
         $('#options-stickychat').prop('checked', true);
         $('#options-chatandusers').prop('checked', true);
-        $('#options-stickychat').prop('disabled', 'disabled');
+        $('#options-stickychat').prop('disabled', true);
         userAndChat = true;
       } else {
         $('#options-stickychat').prop('disabled', false);
@@ -223,14 +226,14 @@ exports.chat = (() => {
         // Send the users focus back to the pad
         if ((evt.altKey === true && evt.which === 67) || evt.which === 27) {
           // If we're in chat already..
-          $(':focus').blur(); // required to do not try to remove!
+          $(':focus').trigger('blur'); // required to do not try to remove!
           padeditor.ace.focus(); // Sends focus back to pad
           evt.preventDefault();
           return false;
         }
       });
       // Clear the chat mentions when the user clicks on the chat input box
-      $('#chatinput').click(() => {
+      $('#chatinput').on('click', () => {
         chatMentions = 0;
         Tinycon.setBubble(0);
       });
@@ -239,14 +242,14 @@ exports.chat = (() => {
       $('body:not(#chatinput)').on('keypress', function (evt) {
         if (evt.altKey && evt.which === 67) {
           // Alt c focuses on the Chat window
-          $(this).blur();
+          $(this).trigger('blur');
           self.show();
-          $('#chatinput').focus();
+          $('#chatinput').trigger('focus');
           evt.preventDefault();
         }
       });
 
-      $('#chatinput').keypress((evt) => {
+      $('#chatinput').on('keypress', (evt) => {
         // if the user typed enter, fire the send
         if (evt.key === 'Enter' && !evt.shiftKey) {
           evt.preventDefault();
@@ -257,7 +260,7 @@ exports.chat = (() => {
       // initial messages are loaded in pad.js' _afterHandshake
 
       $('#chatcounter').text(0);
-      $('#chatloadmessagesbutton').click(() => {
+      $('#chatloadmessagesbutton').on('click', () => {
         const start = Math.max(this.historyPointer - 20, 0);
         const end = this.historyPointer;
 

src/static/js/collab_client.js

@@ -66,7 +66,7 @@ const getCollabClient = (ace2editor, serverVars, initialUserInfo, options, _pad)
   if (browser.firefox) {
     // Prevent "escape" from taking effect and canceling a comet connection;
     // doesn't work if focus is on an iframe.
-    $(window).bind('keydown', (evt) => {
+    $(window).on('keydown', (evt) => {
       if (evt.which === 27) {
         evt.preventDefault();
       }

src/static/js/index.js

@@ -41,7 +41,7 @@ const randomPadName = () => {
 };
 
 $(() => {
-  $('#go2Name').submit(() => {
+  $('#go2Name').on('submit', () => {
     const padname = $('#padname').val();
     if (padname.length > 0) {
       window.location = `p/${encodeURIComponent(padname.trim())}`;
@@ -51,7 +51,7 @@ $(() => {
     return false;
   });
 
-  $('#button').click(() => {
+  $('#button').on('click', () => {
     window.location = `p/${randomPadName()}`;
   });
 

src/static/js/pad.js

@@ -412,10 +412,12 @@ const pad = {
       setTimeout(() => {
         padeditor.ace.focus();
       }, 0);
+      const optionsStickyChat = $('#options-stickychat');
+      optionsStickyChat.on('click', () => { chat.stickToScreen(); });
       // if we have a cookie for always showing chat then show it
       if (padcookie.getPref('chatAlwaysVisible')) {
         chat.stickToScreen(true); // stick it to the screen
-        $('#options-stickychat').prop('checked', true); // set the checkbox to on
+        optionsStickyChat.prop('checked', true); // set the checkbox to on
       }
       // if we have a cookie for always showing chat then show it
       if (padcookie.getPref('chatAndUsers')) {
@@ -437,8 +439,8 @@ const pad = {
       // Prevent sticky chat or chat and users to be checked for mobiles
       const checkChatAndUsersVisibility = (x) => {
         if (x.matches) { // If media query matches
-          $('#options-chatandusers:checked').click();
-          $('#options-stickychat:checked').click();
+          $('#options-chatandusers:checked').trigger('click');
+          $('#options-stickychat:checked').trigger('click');
         }
       };
       const mobileMatch = window.matchMedia('(max-width: 800px)');
@@ -711,7 +713,7 @@ const pad = {
     $('form#reconnectform input.diagnosticInfo').val(JSON.stringify(pad.diagnosticInfo));
     $('form#reconnectform input.missedChanges')
         .val(JSON.stringify(pad.collabClient.getMissedChanges()));
-    $('form#reconnectform').submit();
+    $('form#reconnectform').trigger('submit');
   },
   callWhenNotCommitting: (f) => {
     pad.collabClient.callWhenNotCommitting(f);

src/static/js/pad_automatic_reconnect.js

@@ -96,7 +96,7 @@ const whenConnectionIsRestablishedWithServer = (callback, pad) => {
 };
 
 const forceReconnection = ($modal) => {
-  $modal.find('#forcereconnect').click();
+  $modal.find('#forcereconnect').trigger('click');
 };
 
 const updateCountDownTimerMessage = ($modal, minutes, seconds) => {

src/static/js/pad_connectionstatus.js

@@ -31,7 +31,7 @@ const padconnectionstatus = (() => {
 
   const self = {
     init: () => {
-      $('button#forcereconnect').click(() => {
+      $('button#forcereconnect').on('click', () => {
         window.location.reload();
       });
     },

src/static/js/pad_editbar.js

@@ -65,13 +65,13 @@ class ToolbarItem {
 
   bind(callback) {
     if (this.isButton()) {
-      this.$el.click((event) => {
-        $(':focus').blur();
+      this.$el.on('click', (event) => {
+        $(':focus').trigger('blur');
         callback(this.getCommand(), this);
         event.preventDefault();
       });
     } else if (this.isSelect()) {
-      this.$el.find('select').change(() => {
+      this.$el.find('select').on('change', () => {
         callback(this.getCommand(), this);
       });
     }
@@ -134,7 +134,7 @@ exports.padeditbar = new class {
     $('#editbar .editbarbutton').attr('unselectable', 'on'); // for IE
     this.enable();
     $('#editbar [data-key]').each((i, elt) => {
-      $(elt).unbind('click');
+      $(elt).off('click');
       new ToolbarItem($(elt)).bind((command, item) => {
         this.triggerCommand(command, item);
       });
@@ -144,11 +144,11 @@ exports.padeditbar = new class {
       this._bodyKeyEvent(evt);
     });
 
-    $('.show-more-icon-btn').click(() => {
+    $('.show-more-icon-btn').on('click', () => {
       $('.toolbar').toggleClass('full-icons');
     });
     this.checkAllIconsAreDisplayedInToolbar();
-    $(window).resize(_.debounce(() => this.checkAllIconsAreDisplayedInToolbar(), 100));
+    $(window).on('resize', _.debounce(() => this.checkAllIconsAreDisplayedInToolbar(), 100));
 
     this._registerDefaultCommands();
 
@@ -168,7 +168,7 @@ exports.padeditbar = new class {
     }
 
     // When editor is scrolled, we add a class to style the editbar differently
-    $('iframe[name="ace_outer"]').contents().scroll((ev) => {
+    $('iframe[name="ace_outer"]').contents().on('scroll', (ev) => {
       $('#editbar').toggleClass('editor-scrolled', $(ev.currentTarget).scrollTop() > 2);
     });
   }
@@ -305,12 +305,12 @@ exports.padeditbar = new class {
         // Close any dropdowns we have open..
         this.toggleDropDown('none');
         // Shift focus away from any drop downs
-        $(':focus').blur(); // required to do not try to remove!
+        $(':focus').trigger('blur'); // required to do not try to remove!
         // Check we're on a pad and not on the timeslider
         // Or some other window I haven't thought about!
         if (typeof pad === 'undefined') {
           // Timeslider probably..
-          $('#editorcontainerbox').focus(); // Focus back onto the pad
+          $('#editorcontainerbox').trigger('focus'); // Focus back onto the pad
         } else {
           padeditor.ace.focus(); // Sends focus back to pad
           // The above focus doesn't always work in FF, you have to hit enter afterwards
@@ -320,8 +320,8 @@ exports.padeditbar = new class {
         // Focus on the editbar :)
         const firstEditbarElement = parent.parent.$('#editbar button').first();
 
-        $(evt.currentTarget).blur();
-        firstEditbarElement.focus();
+        $(evt.currentTarget).trigger('blur');
+        firstEditbarElement.trigger('focus');
         evt.preventDefault();
       }
     }
@@ -341,7 +341,7 @@ exports.padeditbar = new class {
         this._editbarPosition--;
         // Allow focus to shift back to end of row and start of row
         if (this._editbarPosition === -1) this._editbarPosition = focusItems.length - 1;
-        $(focusItems[this._editbarPosition]).focus();
+        $(focusItems[this._editbarPosition]).trigger('focus');
       }
 
       // On right arrow move to next button in editbar
@@ -352,7 +352,7 @@ exports.padeditbar = new class {
         this._editbarPosition++;
         // Allow focus to shift back to end of row and start of row
         if (this._editbarPosition >= focusItems.length) this._editbarPosition = 0;
-        $(focusItems[this._editbarPosition]).focus();
+        $(focusItems[this._editbarPosition]).trigger('focus');
       }
     }
   }
@@ -366,7 +366,7 @@ exports.padeditbar = new class {
 
     this.registerCommand('settings', () => {
       this.toggleDropDown('settings');
-      $('#options-stickychat').focus();
+      $('#options-stickychat').trigger('focus');
     });
 
     this.registerCommand('import_export', () => {
@@ -374,22 +374,22 @@ exports.padeditbar = new class {
       // If Import file input exists then focus on it..
       if ($('#importfileinput').length !== 0) {
         setTimeout(() => {
-          $('#importfileinput').focus();
+          $('#importfileinput').trigger('focus');
         }, 100);
       } else {
-        $('.exportlink').first().focus();
+        $('.exportlink').first().trigger('focus');
       }
     });
 
     this.registerCommand('showusers', () => {
       this.toggleDropDown('users');
-      $('#myusernameedit').focus();
+      $('#myusernameedit').trigger('focus');
     });
 
     this.registerCommand('embed', () => {
       this.setEmbedLinks();
       this.toggleDropDown('embed');
-      $('#linkinput').focus().select();
+      $('#linkinput').trigger('focus').trigger('select');
     });
 
     this.registerCommand('savedRevision', () => {

src/static/js/pad_editor.js

@@ -76,7 +76,7 @@ const padeditor = (() => {
       });
 
       // font family change
-      $('#viewfontmenu').change(() => {
+      $('#viewfontmenu').on('change', () => {
         pad.changeViewOption('padFontFamily', $('#viewfontmenu').val());
       });
 
@@ -97,7 +97,7 @@ const padeditor = (() => {
         });
       });
       $('#languagemenu').val(html10n.getLanguage());
-      $('#languagemenu').change(() => {
+      $('#languagemenu').on('change', () => {
         Cookies.set('language', $('#languagemenu').val());
         window.html10n.localize([$('#languagemenu').val(), 'en']);
         if ($('select').niceSelect) {

src/static/js/pad_impexp.js

@@ -38,7 +38,7 @@ const padimpexp = (() => {
   const fileInputUpdated = () => {
     $('#importsubmitinput').addClass('throbbold');
     $('#importformfilediv').addClass('importformenabled');
-    $('#importsubmitinput').removeAttr('disabled');
+    $('#importsubmitinput').prop('disabled', false);
     $('#importmessagefail').fadeOut('fast');
   };
 
@@ -69,8 +69,8 @@ const padimpexp = (() => {
         $('#import_export').removeClass('popup-show');
         if (directDatabaseAccess) window.location.reload();
       }
-      $('#importsubmitinput').removeAttr('disabled').val(html10n.get('pad.impexp.importbutton'));
-      window.setTimeout(() => $('#importfileinput').removeAttr('disabled'), 0);
+      $('#importsubmitinput').prop('disabled', false).val(html10n.get('pad.impexp.importbutton'));
+      window.setTimeout(() => $('#importfileinput').prop('disabled', false), 0);
       $('#importstatusball').hide();
       addImportFrames();
     })();
@@ -162,9 +162,9 @@ const padimpexp = (() => {
       }
 
       addImportFrames();
-      $('#importfileinput').change(fileInputUpdated);
-      $('#importform').unbind('submit').submit(fileInputSubmit);
-      $('.disabledexport').click(cantExport);
+      $('#importfileinput').on('change', fileInputUpdated);
+      $('#importform').off('submit').on('submit', fileInputSubmit);
+      $('.disabledexport').on('click', cantExport);
     },
     disable: () => {
       $('#impexp-disabled-clickcatcher').show();

src/static/js/pad_userlist.js

@@ -325,23 +325,23 @@ const paduserlist = (() => {
   };
 
   const setUpEditable = (jqueryNode, valueGetter, valueSetter) => {
-    jqueryNode.bind('focus', (evt) => {
+    jqueryNode.on('focus', (evt) => {
       const oldValue = valueGetter();
       if (jqueryNode.val() !== oldValue) {
         jqueryNode.val(oldValue);
       }
       jqueryNode.addClass('editactive').removeClass('editempty');
     });
-    jqueryNode.bind('blur', (evt) => {
+    jqueryNode.on('blur', (evt) => {
       const newValue = jqueryNode.removeClass('editactive').val();
       valueSetter(newValue);
     });
     padutils.bindEnterAndEscape(jqueryNode, () => {
-      jqueryNode.blur();
+      jqueryNode.trigger('blur');
     }, () => {
-      jqueryNode.val(valueGetter()).blur();
+      jqueryNode.val(valueGetter()).trigger('blur');
     });
-    jqueryNode.removeAttr('disabled').addClass('editable');
+    jqueryNode.prop('disabled', false).addClass('editable');
   };
 
   let pad = undefined;
@@ -369,15 +369,15 @@ const paduserlist = (() => {
       });
 
       // color picker
-      $('#myswatchbox').click(showColorPicker);
-      $('#mycolorpicker .pickerswatchouter').click(function () {
+      $('#myswatchbox').on('click', showColorPicker);
+      $('#mycolorpicker .pickerswatchouter').on('click', function () {
         $('#mycolorpicker .pickerswatchouter').removeClass('picked');
         $(this).addClass('picked');
       });
-      $('#mycolorpickersave').click(() => {
+      $('#mycolorpickersave').on('click', () => {
         closeColorPicker(true);
       });
-      $('#mycolorpickercancel').click(() => {
+      $('#mycolorpickercancel').on('click', () => {
         closeColorPicker(false);
       });
       //
@@ -587,7 +587,7 @@ const showColorPicker = () => {
 
         li.appendTo(colorsList);
 
-        li.bind('click', (event) => {
+        li.on('click', (event) => {
           $('#colorpickerswatches li').removeClass('picked');
           $(event.target).addClass('picked');
 

src/static/js/pad_utils.js

@@ -224,7 +224,7 @@ const padutils = {
     // It is work on Windows (IE8, Chrome 6.0.472), CentOs (Firefox 3.0) and Mac OSX (Firefox
     // 3.6.10, Chrome 6.0.472, Safari 5.0).
     if (onEnter) {
-      node.keypress((evt) => {
+      node.on('keypress', (evt) => {
         if (evt.which === 13) {
           onEnter(evt);
         }
@@ -232,7 +232,7 @@ const padutils = {
     }
 
     if (onEscape) {
-      node.keydown((evt) => {
+      node.on('keydown', (evt) => {
         if (evt.which === 27) {
           onEscape(evt);
         }
@@ -299,7 +299,7 @@ const padutils = {
       }
       field.removeClass('editempty');
     });
-    field.blur(() => {
+    field.on('blur', () => {
       if (!field.val()) {
         clear();
       }
@@ -313,11 +313,11 @@ const padutils = {
     if (value) {
       $(node).attr('checked', 'checked');
     } else {
-      $(node).removeAttr('checked');
+      $(node).prop('checked', false);
     }
   },
   bindCheckboxChange: (node, func) => {
-    $(node).change(func);
+    $(node).on('change', func);
   },
   encodeUserId: (userId) => userId.replace(/[^a-y0-9]/g, (c) => {
     if (c === '.') return '-';

src/static/js/skin_variants.js

@@ -46,7 +46,7 @@ if (window.location.hash.toLowerCase() === '#skinvariantsbuilder') {
     $('#skin-variant-full-width').prop('checked', $('html').hasClass('full-width-editor'));
   };
 
-  $('.skin-variant').change(() => {
+  $('.skin-variant').on('change', () => {
     updateSkinVariantsClasses();
   });
 

src/static/js/timeslider.js

@@ -82,7 +82,7 @@ const init = () => {
     // get all the export links
     exportLinks = $('#export > .exportlink');
 
-    $('button#forcereconnect').click(() => {
+    $('button#forcereconnect').on('click', () => {
       window.location.reload();
     });
 
@@ -159,7 +159,7 @@ const handleClientVars = (message) => {
   $('#rightstep').attr('title', html10n.get('timeslider.forwardRevision'));
 
   // font family change
-  $('#viewfontmenu').change(function () {
+  $('#viewfontmenu').on('change', function () {
     $('#innerdocbody').css('font-family', $(this).val() || '');
   });
 };

src/static/js/vendors/farbtastic.js

@@ -33,7 +33,7 @@ $._farbtastic = function (container, options) {
   fb.linkTo = function (callback) {
     // Unbind previous nodes
     if (typeof fb.callback == 'object') {
-      $(fb.callback).unbind('keyup', fb.updateValue);
+      $(fb.callback).off('keyup').on('keyup').on('keyup', fb.updateValue);
     }
 
     // Reset color
@@ -45,7 +45,7 @@ $._farbtastic = function (container, options) {
     }
     else if (typeof callback == 'object' || typeof callback == 'string') {
       fb.callback = $(callback);
-      fb.callback.bind('keyup', fb.updateValue);
+      fb.callback.on('keyup', fb.updateValue);
       if (fb.callback[0].value) {
         fb.setColor(fb.callback[0].value);
       }
@@ -388,7 +388,7 @@ $._farbtastic = function (container, options) {
   fb.mousedown = function (event) {
     // Capture mouse
     if (!$._farbtastic.dragging) {
-      $(document).bind('mousemove', fb.mousemove).bind('mouseup', fb.mouseup);
+      $(document).on('mousemove', fb.mousemove).on('mouseup', fb.mouseup);
       $._farbtastic.dragging = true;
     }
 
@@ -429,8 +429,8 @@ $._farbtastic = function (container, options) {
    */
   fb.mouseup = function () {
     // Uncapture mouse
-    $(document).unbind('mousemove', fb.mousemove);
-    $(document).unbind('mouseup', fb.mouseup);
+    $(document).off('mousemove').on('mousemove',fb.mousemove);
+    $(document).off('mouseup').on('mouseup', fb.mouseup);
     $._farbtastic.dragging = false;
   }
 
@@ -519,7 +519,7 @@ $._farbtastic = function (container, options) {
   fb.initWidget();
 
   // Install mousedown handler (the others are set on the document on-demand)
-  $('canvas.farbtastic-overlay', container).mousedown(fb.mousedown);
+  $('canvas.farbtastic-overlay', container).on('mousedown',fb.mousedown);
 
   // Set linked elements/callback
   if (options.callback) {

src/static/js/vendors/nice-select.js

@@ -123,7 +123,7 @@
         $dropdown.find('.list').css('max-height', $maxListHeight + 'px');
 
       } else {
-        $dropdown.focus();
+        $dropdown.trigger('focus');
       }
     });
 

src/static/skins/colibris/pad.js

@@ -2,6 +2,6 @@
 
 window.customStart = () => {
   $('#pad_title').show();
-  $('.buttonicon').mousedown(function () { $(this).parent().addClass('pressed'); });
-  $('.buttonicon').mouseup(function () { $(this).parent().removeClass('pressed'); });
+  $('.buttonicon').on('mousedown', function () { $(this).parent().addClass('pressed'); });
+  $('.buttonicon').on('mouseup', function () { $(this).parent().removeClass('pressed'); });
 };