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/tests/frontend/helper/methods.js

@@ -37,7 +37,7 @@ helper.edit = async (message, line) => {
   await helper.withFastCommit(async (incorp) => {
     helper.linesDiv()[line].sendkeys(message);
     incorp();
-    await helper.waitForPromise(() => editsNum + 1 === helper.commits.length);
+    await helper.waitForPromise(() => editsNum + 1 === helper.commits.length, 10000);
   });
 };
 
@@ -94,7 +94,7 @@ helper.sendChatMessage = async (message) => {
  */
 helper.showSettings = async () => {
   if (helper.isSettingsShown()) return;
-  helper.settingsButton().click();
+  helper.settingsButton().trigger('click');
   await helper.waitForPromise(() => helper.isSettingsShown(), 2000);
 };
 
@@ -106,7 +106,7 @@ helper.showSettings = async () => {
  */
 helper.hideSettings = async () => {
   if (!helper.isSettingsShown()) return;
-  helper.settingsButton().click();
+  helper.settingsButton().trigger('click');
   await helper.waitForPromise(() => !helper.isSettingsShown(), 2000);
 };
 
@@ -119,7 +119,7 @@ helper.hideSettings = async () => {
 helper.enableStickyChatviaSettings = async () => {
   const stickyChat = helper.padChrome$('#options-stickychat');
   if (!helper.isSettingsShown() || stickyChat.is(':checked')) return;
-  stickyChat.click();
+  stickyChat.trigger('click');
   await helper.waitForPromise(() => helper.isChatboxSticky(), 2000);
 };
 
@@ -132,7 +132,7 @@ helper.enableStickyChatviaSettings = async () => {
 helper.disableStickyChatviaSettings = async () => {
   const stickyChat = helper.padChrome$('#options-stickychat');
   if (!helper.isSettingsShown() || !stickyChat.is(':checked')) return;
-  stickyChat.click();
+  stickyChat.trigger('click');
   await helper.waitForPromise(() => !helper.isChatboxSticky(), 2000);
 };
 
@@ -145,7 +145,7 @@ helper.disableStickyChatviaSettings = async () => {
 helper.enableStickyChatviaIcon = async () => {
   const stickyChat = helper.padChrome$('#titlesticky');
   if (!helper.isChatboxShown() || helper.isChatboxSticky()) return;
-  stickyChat.click();
+  stickyChat.trigger('click');
   await helper.waitForPromise(() => helper.isChatboxSticky(), 2000);
 };
 
@@ -157,7 +157,7 @@ helper.enableStickyChatviaIcon = async () => {
  */
 helper.disableStickyChatviaIcon = async () => {
   if (!helper.isChatboxShown() || !helper.isChatboxSticky()) return;
-  helper.titlecross().click();
+  helper.titlecross().trigger('click');
   await helper.waitForPromise(() => !helper.isChatboxSticky(), 2000);
 };
 

src/tests/frontend/helper/ui.js

@@ -16,7 +16,7 @@ helper.contentWindow = () => $('#iframe-container iframe')[0].contentWindow;
 helper.showChat = async () => {
   const chaticon = helper.chatIcon();
   if (!chaticon.hasClass('visible')) return;
-  chaticon.click();
+  chaticon.trigger('click');
   await helper.waitForPromise(() => !chaticon.hasClass('visible'), 2000);
 };
 
@@ -27,7 +27,7 @@ helper.showChat = async () => {
  */
 helper.hideChat = async () => {
   if (!helper.isChatboxShown() || helper.isChatboxSticky()) return;
-  helper.titlecross().click();
+  helper.titlecross().trigger('click');
   await helper.waitForPromise(() => !helper.isChatboxShown(), 2000);
 };
 
@@ -80,7 +80,7 @@ helper.settingsButton =
 helper.toggleUserList = async () => {
   const isVisible = helper.userListShown();
   const button = helper.padChrome$("button[data-l10n-id='pad.toolbar.showusers.title']");
-  button.click();
+  button.trigger('click');
   await helper.waitForPromise(() => !isVisible);
 };
 
@@ -104,9 +104,9 @@ helper.userListShown = () => helper.padChrome$('div#users').hasClass('popup-show
  */
 helper.setUserName = async (name) => {
   const userElement = helper.usernameField();
-  userElement.click();
+  userElement.trigger('click');
   userElement.val(name);
-  userElement.blur();
+  userElement.trigger('blur');
   await helper.waitForPromise(() => !helper.usernameField().hasClass('editactive'));
 };
 

src/tests/frontend/specs/adminsettings.js

@@ -27,7 +27,7 @@ describe('Admin > Settings', function () {
         observer.observe(
             helper.admin$('#response')[0], {attributes: true, childList: false, subtree: false});
       });
-      helper.admin$('#saveSettings').click();
+      helper.admin$('#saveSettings').trigger('click');
       await p;
     };
 
@@ -80,8 +80,8 @@ describe('Admin > Settings', function () {
     await helper.waitForPromise(async () => {
       oldStartTime = await getStartTime();
       return oldStartTime != null && oldStartTime > 0;
-    }, 1000, 500);
-    helper.admin$('#restartEtherpad').click();
+    }, 2100, 500);
+    helper.admin$('#restartEtherpad').trigger('click');
     await helper.waitForPromise(async () => {
       const startTime = await getStartTime();
       return startTime != null && startTime > oldStartTime;

src/tests/frontend/specs/adminupdateplugins.js

@@ -56,7 +56,7 @@ describe('Plugins page', function () {
 
     await timeout(500); // HACK!  Please submit better fix..
     const $doUpdateButton = helper.admin$('.ep_align .do-update');
-    $doUpdateButton.click();
+    $doUpdateButton.trigger('click');
 
     // ensure its showing as Updating
     await helper.waitForPromise(
@@ -79,7 +79,7 @@ describe('Plugins page', function () {
     // skip if we already have ep_headings2 installed..
     if (helper.admin$('.ep_headings2 .do-install').is(':visible') === false) this.skip();
 
-    helper.admin$('.ep_headings2 .do-install').click();
+    helper.admin$('.ep_headings2 .do-install').trigger('click');
     // ensure install has attempted to be started
     await helper.waitForPromise(
         () => helper.admin$('.ep_headings2 .do-install').length !== 0, 120000);
@@ -96,7 +96,7 @@ describe('Plugins page', function () {
     await helper.waitForPromise(
         () => helper.admin$('.ep_headings2 .do-uninstall').length !== 0, 120000);
 
-    helper.admin$('.ep_headings2 .do-uninstall').click();
+    helper.admin$('.ep_headings2 .do-uninstall').trigger('click');
 
     // ensure its showing uninstalling
     await helper.waitForPromise(

src/tests/frontend/specs/authorship_of_editions.js

@@ -25,7 +25,7 @@ describe('author of pad edition', function () {
     $lineWithUnorderedList.sendkeys('{selectall}');
 
     const $insertUnorderedListButton = helper.padChrome$('.buttonicon-insertunorderedlist');
-    $insertUnorderedListButton.click();
+    $insertUnorderedListButton.trigger('click');
 
     await helper.waitForPromise(() => (
       getLine(LINE_WITH_UNORDERED_LIST).find('ul li').length === 1 &&
@@ -36,7 +36,7 @@ describe('author of pad edition', function () {
     $lineWithOrderedList.sendkeys('{selectall}');
 
     const $insertOrderedListButton = helper.padChrome$('.buttonicon-insertorderedlist');
-    $insertOrderedListButton.click();
+    $insertOrderedListButton.trigger('click');
 
     await helper.waitForPromise(() => (
       getLine(LINE_WITH_ORDERED_LIST).find('ol li').length === 1 &&

src/tests/frontend/specs/bold.js

@@ -18,7 +18,7 @@ describe('bold button', function () {
 
     // get the bold button and click it
     const $boldButton = chrome$('.buttonicon-bold');
-    $boldButton.click();
+    $boldButton.trigger('click');
 
     const $newFirstTextElement = inner$('div').first();
 

src/tests/frontend/specs/change_user_color.js

@@ -13,10 +13,10 @@ describe('change user color', function () {
 
     // click on the settings button to make settings visible
     let $userButton = chrome$('.buttonicon-showusers');
-    $userButton.click();
+    $userButton.trigger('click');
 
     let $userSwatch = chrome$('#myswatch');
-    $userSwatch.click();
+    $userSwatch.trigger('click');
 
     const fb = chrome$.farbtastic('#colorpicker');
     const $colorPickerSave = chrome$('#mycolorpickersave');
@@ -34,7 +34,7 @@ describe('change user color', function () {
     // The swatch updates as the test color is picked.
     fb.setColor(testColorHash);
     expect($colorPickerPreview.css('background-color')).to.be(testColorRGB);
-    $colorPickerSave.click();
+    $colorPickerSave.trigger('click');
     expect($userSwatch.css('background-color')).to.be(testColorRGB);
 
     // give it a second to save the color on the server side
@@ -47,10 +47,10 @@ describe('change user color', function () {
 
     // click on the settings button to make settings visible
     $userButton = chrome$('.buttonicon-showusers');
-    $userButton.click();
+    $userButton.trigger('click');
 
     $userSwatch = chrome$('#myswatch');
-    $userSwatch.click();
+    $userSwatch.trigger('click');
 
     $colorPickerPreview = chrome$('#mycolorpickerpreview');
 
@@ -64,15 +64,15 @@ describe('change user color', function () {
 
     const $colorOption = helper.padChrome$('#options-colorscheck');
     if (!$colorOption.is(':checked')) {
-      $colorOption.click();
+      $colorOption.trigger('click');
     }
 
     // click on the settings button to make settings visible
     const $userButton = chrome$('.buttonicon-showusers');
-    $userButton.click();
+    $userButton.trigger('click');
 
     const $userSwatch = chrome$('#myswatch');
-    $userSwatch.click();
+    $userSwatch.trigger('click');
 
     const fb = chrome$.farbtastic('#colorpicker');
     const $colorPickerSave = chrome$('#mycolorpickersave');
@@ -82,11 +82,11 @@ describe('change user color', function () {
     const testColorRGB = 'rgb(171, 205, 239)';
 
     fb.setColor(testColorHash);
-    $colorPickerSave.click();
+    $colorPickerSave.trigger('click');
 
     // click on the chat button to make chat visible
     const $chatButton = chrome$('#chaticon');
-    $chatButton.click();
+    $chatButton.trigger('click');
     const $chatInput = chrome$('#chatinput');
     $chatInput.sendkeys('O hi'); // simulate a keypress of typing user
     $chatInput.sendkeys('{enter}');

src/tests/frontend/specs/chat_load_messages.js

@@ -10,7 +10,7 @@ describe('chat-load-messages', function () {
   it('adds a lot of messages', async function () {
     const chrome$ = helper.padChrome$;
     const chatButton = chrome$('#chaticon');
-    chatButton.click();
+    chatButton.trigger('click');
     const chatInput = chrome$('#chatinput');
     const chatText = chrome$('#chattext');
 
@@ -33,7 +33,7 @@ describe('chat-load-messages', function () {
     const chrome$ = helper.padChrome$;
     helper.waitFor(() => {
       const chatButton = chrome$('#chaticon');
-      chatButton.click();
+      chatButton.trigger('click');
       chatText = chrome$('#chattext');
       return chatText.children('p').length === expectedCount;
     }).always(() => {
@@ -47,11 +47,11 @@ describe('chat-load-messages', function () {
     const expectedCount = 122;
     const chrome$ = helper.padChrome$;
     const chatButton = chrome$('#chaticon');
-    chatButton.click();
+    chatButton.trigger('click');
     const chatText = chrome$('#chattext');
     const loadMsgBtn = chrome$('#chatloadmessagesbutton');
 
-    loadMsgBtn.click();
+    loadMsgBtn.trigger('click');
     helper.waitFor(() => chatText.children('p').length === expectedCount).always(() => {
       expect(chatText.children('p').length).to.be(expectedCount);
       done();
@@ -63,11 +63,11 @@ describe('chat-load-messages', function () {
     const expectedDisplay = 'none';
     const chrome$ = helper.padChrome$;
     const chatButton = chrome$('#chaticon');
-    chatButton.click();
+    chatButton.trigger('click');
     const loadMsgBtn = chrome$('#chatloadmessagesbutton');
     const loadMsgBall = chrome$('#chatloadmessagesball');
 
-    loadMsgBtn.click();
+    loadMsgBtn.trigger('click');
     helper.waitFor(() => loadMsgBtn.css('display') === expectedDisplay &&
              loadMsgBall.css('display') === expectedDisplay).always(() => {
       expect(loadMsgBtn.css('display')).to.be(expectedDisplay);

src/tests/frontend/specs/clear_authorship_colors.js

@@ -32,11 +32,11 @@ describe('clear authorship colors button', function () {
         () => inner$('div span').first().attr('class').indexOf('author') !== -1);
 
     // IE hates you if you don't give focus to the inner frame bevore you do a clearAuthorship
-    inner$('div').first().focus();
+    inner$('div').first().trigger('focus');
 
     // get the clear authorship colors button and click it
     const $clearauthorshipcolorsButton = chrome$('.buttonicon-clearauthorship');
-    $clearauthorshipcolorsButton.click();
+    $clearauthorshipcolorsButton.trigger('click');
 
     // does the first div include an author class?
     const hasAuthorClass = inner$('div').first().attr('class').indexOf('author') !== -1;
@@ -70,11 +70,11 @@ describe('clear authorship colors button', function () {
         () => inner$('div span').first().attr('class').indexOf('author') !== -1);
 
     // IE hates you if you don't give focus to the inner frame bevore you do a clearAuthorship
-    inner$('div').first().focus();
+    inner$('div').first().trigger('focus');
 
     // get the clear authorship colors button and click it
     const $clearauthorshipcolorsButton = chrome$('.buttonicon-clearauthorship');
-    $clearauthorshipcolorsButton.click();
+    $clearauthorshipcolorsButton.trigger('click');
 
     // does the first div include an author class?
     let hasAuthorClass = inner$('div').first().attr('class').indexOf('author') !== -1;
@@ -93,7 +93,7 @@ describe('clear authorship colors button', function () {
     const $undoButton = chrome$('.buttonicon-undo');
 
     // click the button
-    $undoButton.click(); // shouldn't do anything
+    $undoButton.trigger('click'); // shouldn't do anything
     hasAuthorClass = inner$('div').first().attr('class').indexOf('author') !== -1;
     expect(hasAuthorClass).to.be(false);
 

src/tests/frontend/specs/drag_and_drop.js

@@ -24,7 +24,7 @@ describe('drag and drop', function () {
       before(async function () {
         const originalHTML = helper.padInner$('body').html();
         const $undoButton = helper.padChrome$('.buttonicon-undo');
-        $undoButton.click();
+        $undoButton.trigger('click');
         await helper.waitForPromise(() => helper.padInner$('body').html() !== originalHTML);
       });
 
@@ -59,7 +59,7 @@ describe('drag and drop', function () {
       before(async function () {
         const originalHTML = helper.padInner$('body').html();
         const $undoButton = helper.padChrome$('.buttonicon-undo');
-        $undoButton.click();
+        $undoButton.trigger('click');
         await helper.waitForPromise(() => helper.padInner$('body').html() !== originalHTML);
       });
 

src/tests/frontend/specs/embed_value.js

@@ -59,7 +59,7 @@ describe('embed links', function () {
         const chrome$ = helper.padChrome$;
 
         // open share dropdown
-        chrome$('.buttonicon-embed').click();
+        chrome$('.buttonicon-embed').trigger('click');
 
         // get the link of the share field + the actual pad url and compare them
         const shareLink = chrome$('#linkinput').val();
@@ -73,7 +73,7 @@ describe('embed links', function () {
         const chrome$ = helper.padChrome$;
 
         // open share dropdown
-        chrome$('.buttonicon-embed').click();
+        chrome$('.buttonicon-embed').trigger('click');
 
         // get the link of the share field + the actual pad url and compare them
         const embedCode = chrome$('#embedinput').val();
@@ -93,8 +93,8 @@ describe('embed links', function () {
         const chrome$ = helper.padChrome$;
 
         // open share dropdown
-        chrome$('.buttonicon-embed').click();
-        chrome$('#readonlyinput').click();
+        chrome$('.buttonicon-embed').trigger('click');
+        chrome$('#readonlyinput').trigger('click');
         chrome$('#readonlyinput:checkbox:not(:checked)').attr('checked', 'checked');
 
         // get the link of the share field + the actual pad url and compare them
@@ -109,9 +109,9 @@ describe('embed links', function () {
         const chrome$ = helper.padChrome$;
 
         // open share dropdown
-        chrome$('.buttonicon-embed').click();
+        chrome$('.buttonicon-embed').trigger('click');
         // check read only checkbox, a bit hacky
-        chrome$('#readonlyinput').click();
+        chrome$('#readonlyinput').trigger('click');
         chrome$('#readonlyinput:checkbox:not(:checked)').attr('checked', 'checked');
 
 

src/tests/frontend/specs/font_type.js

@@ -12,7 +12,7 @@ describe('font select', function () {
 
     // click on the settings button to make settings visible
     const $settingsButton = chrome$('.buttonicon-settings');
-    $settingsButton.click();
+    $settingsButton.trigger('click');
 
     // get the font menu and RobotoMono option
     const $viewfontmenu = chrome$('#viewfontmenu');
@@ -21,7 +21,7 @@ describe('font select', function () {
     // $RobotoMonooption.attr('selected','selected');
     // commenting out above will break safari test
     $viewfontmenu.val('RobotoMono');
-    $viewfontmenu.change();
+    $viewfontmenu.trigger('change');
 
     // check if font changed to RobotoMono
     const fontFamily = inner$('body').css('font-family').toLowerCase();

src/tests/frontend/specs/helper.js

@@ -47,13 +47,13 @@ describe('the test helper', function () {
 
       // click on the settings button to make settings visible
       let $userButton = chrome$('.buttonicon-showusers');
-      $userButton.click();
+      $userButton.trigger('click');
 
       let $usernameInput = chrome$('#myusernameedit');
-      $usernameInput.click();
+      $usernameInput.trigger('click');
 
       $usernameInput.val('John McLear');
-      $usernameInput.blur();
+      $usernameInput.trigger('blur');
 
       // Before refreshing, make sure the name is there
       expect($usernameInput.val()).to.be('John McLear');
@@ -85,7 +85,7 @@ describe('the test helper', function () {
 
       // click on the settings button to make settings visible
       $userButton = chrome$('.buttonicon-showusers');
-      $userButton.click();
+      $userButton.trigger('click');
 
       // confirm that the session was actually cleared
       $usernameInput = chrome$('#myusernameedit');

src/tests/frontend/specs/importexport.js

@@ -527,7 +527,7 @@ describe('importexport.js', function () {
     const isVisible = () => popup.hasClass('popup-show');
     if (isVisible()) return;
     const button = helper.padChrome$('button[data-l10n-id="pad.toolbar.import_export.title"]');
-    button.click();
+    button.trigger('click');
     await helper.waitForPromise(isVisible);
   });
 
@@ -558,7 +558,7 @@ describe('importexport.js', function () {
         dt.items.add(new File([contents], `file.${ext}`, {type: 'text/plain'}));
         const form = helper.padChrome$('#importform');
         form.find('input[type=file]')[0].files = dt.files;
-        form.find('#importsubmitinput').submit();
+        form.find('#importsubmitinput').trigger('submit');
         try {
           await helper.waitForPromise(() => {
             const got = helper.linesDiv();

src/tests/frontend/specs/indentation.js

@@ -27,7 +27,7 @@ describe('indentation button', function () {
     const chrome$ = helper.padChrome$;
 
     const $indentButton = chrome$('.buttonicon-indent');
-    $indentButton.click();
+    $indentButton.trigger('click');
 
     await helper.waitForPromise(() => inner$('div').first().find('ul li').length === 1);
   });
@@ -38,7 +38,7 @@ describe('indentation button', function () {
     const chrome$ = helper.padChrome$;
 
     const $indentButton = chrome$('.buttonicon-indent');
-    $indentButton.click();
+    $indentButton.trigger('click');
 
     // type a bit, make a line break and type again
     const $firstTextElement = inner$('div span').first();
@@ -147,19 +147,19 @@ describe('indentation button', function () {
     helper.selectLines($firstLine, $secondLine);
 
     const $indentButton = chrome$('.buttonicon-indent');
-    $indentButton.click();
+    $indentButton.trigger('click');
 
     await helper.waitForPromise(() => inner$('div').first().find('ul li').length === 1);
 
     // apply bold
     const $boldButton = chrome$('.buttonicon-bold');
-    $boldButton.click();
+    $boldButton.trigger('click');
 
     await helper.waitForPromise(() => inner$('div').first().find('b').length === 1);
 
     // outdent first 2 lines
     const $outdentButton = chrome$('.buttonicon-outdent');
-    $outdentButton.click();
+    $outdentButton.trigger('click');
     await helper.waitForPromise(() => inner$('div').first().find('ul li').length === 0);
 
     // check if '*' is displayed
@@ -179,7 +179,7 @@ describe('indentation button', function () {
 
     // get the indentation button and click it
     const $indentButton = helper.$getPadChrome().find('.buttonicon-indent');
-    $indentButton.click();
+    $indentButton.trigger('click');
 
     let newFirstTextElement = $inner.find('div').first();
 
@@ -196,7 +196,7 @@ describe('indentation button', function () {
     expect(isLI).to.be(true);
 
     // indent again
-    $indentButton.click();
+    $indentButton.trigger('click');
 
     newFirstTextElement = $inner.find('div').first();
 
@@ -215,8 +215,8 @@ describe('indentation button', function () {
 
     // get the unindentation button and click it twice
     const $outdentButton = helper.$getPadChrome().find('.buttonicon-outdent');
-    $outdentButton.click();
-    $outdentButton.click();
+    $outdentButton.trigger('click');
+    $outdentButton.trigger('click');
 
     newFirstTextElement = $inner.find('div').first();
 
@@ -242,8 +242,8 @@ describe('indentation button', function () {
     helper.selectText(firstTextElement[0], $inner);
 
     // indent twice
-    $indentButton.click();
-    $indentButton.click();
+    $indentButton.trigger('click');
+    $indentButton.trigger('click');
 
     // get the first text element out of the inner iframe
     firstTextElement = $inner.find('div').first();

src/tests/frontend/specs/italic.js

@@ -18,7 +18,7 @@ describe('italic some text', function () {
 
     // get the bold button and click it
     const $boldButton = chrome$('.buttonicon-italic');
-    $boldButton.click();
+    $boldButton.trigger('click');
 
     // ace creates a new dom element when you press a button, just get the first text element again
     const $newFirstTextElement = inner$('div').first();

src/tests/frontend/specs/language.js

@@ -16,7 +16,7 @@ describe('Language select and change', function () {
 
     // click on the settings button to make settings visible
     const $settingsButton = chrome$('.buttonicon-settings');
-    $settingsButton.click();
+    $settingsButton.trigger('click');
 
     // click the language button
     const $language = chrome$('#languagemenu');
@@ -24,7 +24,7 @@ describe('Language select and change', function () {
 
     // select german
     $languageoption.attr('selected', 'selected');
-    $language.change();
+    $language.trigger('change');
 
     await helper.waitForPromise(
         () => chrome$('.buttonicon-bold').parent()[0].title === 'Fett (Strg-B)');
@@ -45,13 +45,13 @@ describe('Language select and change', function () {
 
     // click on the settings button to make settings visible
     const $settingsButton = chrome$('.buttonicon-settings');
-    $settingsButton.click();
+    $settingsButton.trigger('click');
 
     // click the language button
     const $language = chrome$('#languagemenu');
     // select english
     $language.val('en');
-    $language.change();
+    $language.trigger('change');
 
     // get the value of the bold button
     let $boldButton = chrome$('.buttonicon-bold').parent();
@@ -79,7 +79,7 @@ describe('Language select and change', function () {
 
     // click on the settings button to make settings visible
     const $settingsButton = chrome$('.buttonicon-settings');
-    $settingsButton.click();
+    $settingsButton.trigger('click');
 
     // click the language button
     const $language = chrome$('#languagemenu');
@@ -88,7 +88,7 @@ describe('Language select and change', function () {
     // select arabic
     // $languageoption.attr('selected','selected'); // Breaks the test..
     $language.val('ar');
-    $languageoption.change();
+    $languageoption.trigger('change');
 
     await helper.waitForPromise(() => chrome$('html')[0].dir !== 'ltr');
 
@@ -101,7 +101,7 @@ describe('Language select and change', function () {
 
     // click on the settings button to make settings visible
     const $settingsButton = chrome$('.buttonicon-settings');
-    $settingsButton.click();
+    $settingsButton.trigger('click');
 
     // click the language button
     const $language = chrome$('#languagemenu');
@@ -111,7 +111,7 @@ describe('Language select and change', function () {
     // select arabic
     $languageoption.attr('selected', 'selected');
     $language.val('en');
-    $languageoption.change();
+    $languageoption.trigger('change');
 
     await helper.waitForPromise(() => chrome$('html')[0].dir !== 'rtl');
 

src/tests/frontend/specs/multiple_authors_clear_authorship_colors.js

@@ -33,7 +33,7 @@ describe('author of pad edition', function () {
 
     // get the clear authorship colors button and click it
     const $clearauthorshipcolorsButton = chrome$('.buttonicon-clearauthorship');
-    $clearauthorshipcolorsButton.click();
+    $clearauthorshipcolorsButton.trigger('click');
 
     // does the first divs span include an author class?
     const hasAuthorClass = inner$('div span').first().attr('class').indexOf('author') !== -1;

src/tests/frontend/specs/ordered_list.js

@@ -12,7 +12,7 @@ describe('ordered_list.js', function () {
       const chrome$ = helper.padChrome$;
 
       const $insertorderedlistButton = chrome$('.buttonicon-insertorderedlist');
-      $insertorderedlistButton.click();
+      $insertorderedlistButton.trigger('click');
 
       await helper.waitForPromise(() => inner$('div').first().find('ol li').length === 1);
     });
@@ -115,10 +115,10 @@ describe('ordered_list.js', function () {
       const $insertorderedlistButton = chrome$('.buttonicon-insertorderedlist');
       const $firstLine = inner$('div').first();
       $firstLine.sendkeys('{selectall}');
-      $insertorderedlistButton.click();
+      $insertorderedlistButton.trigger('click');
       const $secondLine = inner$('div').first().next();
       $secondLine.sendkeys('{selectall}');
-      $insertorderedlistButton.click();
+      $insertorderedlistButton.trigger('click');
       expect($secondLine.find('ol').attr('start') === 2);
     });
 
@@ -128,7 +128,7 @@ describe('ordered_list.js', function () {
       const chrome$ = helper.padChrome$;
 
       const $insertorderedlistButton = chrome$('.buttonicon-insertorderedlist');
-      $insertorderedlistButton.click();
+      $insertorderedlistButton.trigger('click');
 
       // type a bit, make a line break and type again
       const $firstTextElement = inner$('div span').first();
@@ -182,7 +182,7 @@ describe('ordered_list.js', function () {
       $firstTextElement.sendkeys('{selectall}');
 
       const $insertorderedlistButton = chrome$('.buttonicon-insertorderedlist');
-      $insertorderedlistButton.click();
+      $insertorderedlistButton.trigger('click');
 
       const e = new inner$.Event(helper.evtType);
       e.keyCode = 9; // tab
@@ -217,15 +217,15 @@ describe('ordered_list.js', function () {
       $firstTextElement.sendkeys('{selectall}');
 
       const $insertorderedlistButton = chrome$('.buttonicon-insertorderedlist');
-      $insertorderedlistButton.click();
+      $insertorderedlistButton.trigger('click');
 
       const $indentButton = chrome$('.buttonicon-indent');
-      $indentButton.click(); // make it indented twice
+      $indentButton.trigger('click'); // make it indented twice
 
       expect(inner$('div').first().find('.list-number2').length === 1).to.be(true);
 
       const $outdentButton = chrome$('.buttonicon-outdent');
-      $outdentButton.click(); // make it deindented to 1
+      $outdentButton.trigger('click'); // make it deindented to 1
 
       await helper.waitForPromise(() => inner$('div').first().find('.list-number1').length === 1);
     });

src/tests/frontend/specs/pad_modal.js

@@ -71,16 +71,16 @@ describe('Pad modal', function () {
 
   const clickOnPadInner = () => {
     const $editor = helper.padInner$('#innerdocbody');
-    $editor.click();
+    $editor.trigger('click');
   };
 
   const clickOnPadOuter = () => {
     const $lineNumbersColumn = helper.padOuter$('#sidedivinner');
-    $lineNumbersColumn.click();
+    $lineNumbersColumn.trigger('click');
   };
 
   const openSettingsAndWaitForModalToBeVisible = async () => {
-    helper.padChrome$('.buttonicon-settings').click();
+    helper.padChrome$('.buttonicon-settings').trigger('click');
 
     // wait for modal to be displayed
     const modalSelector = '#settings';

src/tests/frontend/specs/redo.js

@@ -22,8 +22,8 @@ describe('undo button then redo button', function () {
     const $undoButton = chrome$('.buttonicon-undo');
     const $redoButton = chrome$('.buttonicon-redo');
     // click the buttons
-    $undoButton.click(); // removes foo
-    $redoButton.click(); // resends foo
+    $undoButton.trigger('click'); // removes foo
+    $redoButton.trigger('click'); // resends foo
 
     await helper.waitForPromise(() => inner$('div span').first().text() === newString);
     const finalValue = inner$('div').first().text();

src/tests/frontend/specs/select_formatting_buttons.js

@@ -13,7 +13,7 @@ describe('select formatting buttons when selection has style applied', function
     const chrome$ = helper.padChrome$;
     selectLine(line);
     const $formattingButton = chrome$(`.buttonicon-${style}`);
-    $formattingButton.click();
+    $formattingButton.trigger('click');
   };
 
   const isButtonSelected = function (style) {
@@ -37,7 +37,7 @@ describe('select formatting buttons when selection has style applied', function
   const undo = async function () {
     const originalHTML = helper.padInner$('body').html();
     const $undoButton = helper.padChrome$('.buttonicon-undo');
-    $undoButton.click();
+    $undoButton.trigger('click');
     await helper.waitForPromise(() => helper.padInner$('body').html() !== originalHTML);
   };
 

src/tests/frontend/specs/strikethrough.js

@@ -18,7 +18,7 @@ describe('strikethrough button', function () {
 
     // get the strikethrough button and click it
     const $strikethroughButton = chrome$('.buttonicon-strikethrough');
-    $strikethroughButton.click();
+    $strikethroughButton.trigger('click');
 
     // ace creates a new dom element when you press a button, just get the first text element again
     const $newFirstTextElement = inner$('div').first();

src/tests/frontend/specs/timeslider.js

@@ -22,7 +22,7 @@ xdescribe('timeslider button takes you to the timeslider of a pad', function ()
     await helper.waitForPromise(() => modifiedValue !== originalValue);
 
     const $timesliderButton = chrome$('#timesliderlink');
-    $timesliderButton.click(); // So click the timeslider link
+    $timesliderButton.trigger('click'); // So click the timeslider link
 
     await helper.waitForPromise(() => {
       const iFrameURL = chrome$.window.location.href;

src/tests/frontend/specs/timeslider_follow.js

@@ -25,7 +25,7 @@ describe('timeslider follow', function () {
 
     // set to follow contents as it arrives
     helper.contentWindow().$('#options-followContents').prop('checked', true);
-    helper.contentWindow().$('#playpause_button_icon').click();
+    helper.contentWindow().$('#playpause_button_icon').trigger('click');
 
     let newTop;
     await helper.waitForPromise(() => {
@@ -64,27 +64,27 @@ describe('timeslider follow', function () {
      */
 
     // line 40 changed
-    helper.contentWindow().$('#leftstep').click();
+    helper.contentWindow().$('#leftstep').trigger('click');
     await helper.waitForPromise(() => hasFollowedToLine(40));
 
     // line 1 is the first line that changed
-    helper.contentWindow().$('#leftstep').click();
+    helper.contentWindow().$('#leftstep').trigger('click');
     await helper.waitForPromise(() => hasFollowedToLine(1));
 
     // line 1 changed
-    helper.contentWindow().$('#leftstep').click();
+    helper.contentWindow().$('#leftstep').trigger('click');
     await helper.waitForPromise(() => hasFollowedToLine(1));
 
     // line 1 changed
-    helper.contentWindow().$('#rightstep').click();
+    helper.contentWindow().$('#rightstep').trigger('click');
     await helper.waitForPromise(() => hasFollowedToLine(1));
 
     // line 1 is the first line that changed
-    helper.contentWindow().$('#rightstep').click();
+    helper.contentWindow().$('#rightstep').trigger('click');
     await helper.waitForPromise(() => hasFollowedToLine(1));
 
     // line 40 changed
-    helper.contentWindow().$('#rightstep').click();
+    helper.contentWindow().$('#rightstep').trigger('click');
     helper.waitForPromise(() => hasFollowedToLine(40));
   });
 });

src/tests/frontend/specs/timeslider_revisions.js

@@ -12,7 +12,7 @@ describe('timeslider', function () {
 
     // Create a bunch of revisions.
     for (let i = 0; i < 99; i++) await helper.edit('a');
-    chrome$('.buttonicon-savedRevision').click();
+    chrome$('.buttonicon-savedRevision').trigger('click');
     await helper.waitForPromise(() => helper.padChrome$('.saved-revision').length > 0);
     // Give some time to send the SAVE_REVISION message to the server before navigating away.
     await new Promise((resolve) => setTimeout(resolve, 100));

src/tests/frontend/specs/undo.js

@@ -20,7 +20,7 @@ describe('undo button', function () {
     // get clear authorship button as a variable
     const $undoButton = chrome$('.buttonicon-undo');
     // click the button
-    $undoButton.click();
+    $undoButton.trigger('click');
 
     await helper.waitForPromise(() => inner$('div span').first().text() === originalValue);
   });

src/tests/frontend/specs/unordered_list.js

@@ -13,7 +13,7 @@ describe('unordered_list.js', function () {
       const originalText = inner$('div').first().text();
 
       const $insertunorderedlistButton = chrome$('.buttonicon-insertunorderedlist');
-      $insertunorderedlistButton.click();
+      $insertunorderedlistButton.trigger('click');
 
       await helper.waitForPromise(() => {
         const newText = inner$('div').first().text();
@@ -21,7 +21,7 @@ describe('unordered_list.js', function () {
       });
 
       // remove indentation by bullet and ensure text string remains the same
-      chrome$('.buttonicon-outdent').click();
+      chrome$('.buttonicon-outdent').trigger('click');
       await helper.waitForPromise(() => inner$('div').first().text() === originalText);
     });
   });
@@ -38,7 +38,7 @@ describe('unordered_list.js', function () {
       const originalText = inner$('div').first().text();
 
       const $insertunorderedlistButton = chrome$('.buttonicon-insertunorderedlist');
-      $insertunorderedlistButton.click();
+      $insertunorderedlistButton.trigger('click');
 
       await helper.waitForPromise(() => {
         const newText = inner$('div').first().text();
@@ -46,7 +46,7 @@ describe('unordered_list.js', function () {
       });
 
       // remove indentation by bullet and ensure text string remains the same
-      $insertunorderedlistButton.click();
+      $insertunorderedlistButton.trigger('click');
       await helper.waitForPromise(() => inner$('div').find('ul').length !== 1);
     });
   });
@@ -63,7 +63,7 @@ describe('unordered_list.js', function () {
       const chrome$ = helper.padChrome$;
 
       const $insertorderedlistButton = chrome$('.buttonicon-insertunorderedlist');
-      $insertorderedlistButton.click();
+      $insertorderedlistButton.trigger('click');
 
       // type a bit, make a line break and type again
       const $firstTextElement = inner$('div span').first();
@@ -98,7 +98,7 @@ describe('unordered_list.js', function () {
       $firstTextElement.sendkeys('{selectall}');
 
       const $insertorderedlistButton = chrome$('.buttonicon-insertunorderedlist');
-      $insertorderedlistButton.click();
+      $insertorderedlistButton.trigger('click');
 
       const e = new inner$.Event(helper.evtType);
       e.keyCode = 9; // tab
@@ -131,14 +131,14 @@ describe('unordered_list.js', function () {
       $firstTextElement.sendkeys('{selectall}');
 
       const $insertunorderedlistButton = chrome$('.buttonicon-insertunorderedlist');
-      $insertunorderedlistButton.click();
+      $insertunorderedlistButton.trigger('click');
 
       const $indentButton = chrome$('.buttonicon-indent');
-      $indentButton.click(); // make it indented twice
+      $indentButton.trigger('click'); // make it indented twice
 
       expect(inner$('div').first().find('.list-bullet2').length === 1).to.be(true);
       const $outdentButton = chrome$('.buttonicon-outdent');
-      $outdentButton.click(); // make it deindented to 1
+      $outdentButton.trigger('click'); // make it deindented to 1
 
       await helper.waitForPromise(() => inner$('div').first().find('.list-bullet1').length === 1);
     });

src/tests/frontend/specs/xxauto_reconnect.js

@@ -32,7 +32,7 @@ describe('Automatic pad reload on Force Reconnect message', function () {
   context('and user clicks on Cancel', function () {
     beforeEach(async function () {
       const $errorMessageModal = helper.padChrome$('#connectivity .userdup');
-      $errorMessageModal.find('#cancelreconnect').click();
+      $errorMessageModal.find('#cancelreconnect').trigger('click');
       await helper.waitForPromise(
           () => helper.padChrome$('#connectivity .userdup').is(':visible') === true);
     });