#5822 Fix: deprecated errors (#5842)

* fix: deprecated errors * fix: ui tests * fix: ui tests * fix: pr reviews
FlowCrypt · Sep 25, 2024 · 3d5821d · 3d5821d
1 parent cff2332
commit 3d5821d
Show file tree

Hide file tree

Showing 52 changed files with 200 additions and 103 deletions.
diff --git a/eslint.config.mjs b/eslint.config.mjs
@@ -72,8 +72,7 @@ const commonConfig = {
         format: ['camelCase', 'PascalCase'],
       },
     ],
-    // should be enabled in https://github.com/FlowCrypt/flowcrypt-browser/issues/5822
-    '@typescript-eslint/no-deprecated': 'off',
+    '@typescript-eslint/no-deprecated': 'warn',
     '@typescript-eslint/no-empty-interface': 'off',
     '@typescript-eslint/no-explicit-any': ['warn'],
     '@typescript-eslint/no-extraneous-class': 'off',

diff --git a/extension/chrome/elements/add_pubkey.ts b/extension/chrome/elements/add_pubkey.ts
@@ -76,7 +76,10 @@ View.run(
           }
         },
       });
-      $('select.copy_from_email').change(this.setHandler(el => this.copyFromEmailHandler(el)));
+      $('select.copy_from_email').on(
+        'change',
+        this.setHandler(el => this.copyFromEmailHandler(el))
+      );
       $('.action_ok').on(
         'click',
         this.setHandler(() => this.submitHandler())

diff --git a/extension/chrome/elements/attachment.ts b/extension/chrome/elements/attachment.ts
@@ -376,7 +376,7 @@ export class AttachmentDownloadView extends View {
       const result = await this.gmail.msgGet(this.attachment.msgId, 'full');
       if (result?.payload?.parts) {
         for (const attMeta of result.payload.parts) {
-          if (attMeta.filename === name && attMeta.body && attMeta.body.size === this.size && attMeta.body.attachmentId) {
+          if (attMeta.filename === this.name && attMeta.body && attMeta.body.size === this.size && attMeta.body.attachmentId) {
             this.attachment.id = attMeta.body.attachmentId;
             return;
           }

diff --git a/extension/chrome/elements/attachment_preview.ts b/extension/chrome/elements/attachment_preview.ts
@@ -17,6 +17,8 @@ import { AttachmentWarnings } from './shared/attachment_warnings.js';
 import * as pdfjsLib from 'pdfjs';
 import { AttachmentPreviewPdf } from '../../js/common/ui/attachment_preview_pdf.js';
 
+// https://github.com/FlowCrypt/flowcrypt-browser/issues/5822#issuecomment-2362529197
+// eslint-disable-next-line @typescript-eslint/no-deprecated
 pdfjsLib.GlobalWorkerOptions.workerSrc = chrome.runtime.getURL(`lib/pdf.worker.min.mjs`);
 type AttachmentType = 'img' | 'txt' | 'pdf';
 

diff --git a/extension/chrome/elements/backup.ts b/extension/chrome/elements/backup.ts
@@ -70,7 +70,7 @@ View.run(
         'click',
         this.setHandler(async () => this.testPassphraseHandler())
       );
-      $('#pass_phrase').keydown(this.setEnterHandlerThatClicks('.action_test_pass'));
+      $('#pass_phrase').on('keydown', this.setEnterHandlerThatClicks('.action_test_pass'));
     };
 
     private sendResizeMsg = () => {

diff --git a/extension/chrome/elements/compose-modules/compose-attachments-module.ts b/extension/chrome/elements/compose-modules/compose-attachments-module.ts
@@ -17,7 +17,7 @@ export class ComposeAttachmentsModule extends ViewModule<ComposeView> {
   }
 
   public setHandlers = () => {
-    this.view.S.cached('body').bind({ drop: Ui.event.stop(), dragover: Ui.event.stop() }); // prevents files dropped out of the intended drop area to interfere
+    this.view.S.cached('body').on({ drop: Ui.event.stop(), dragover: Ui.event.stop() }); // prevents files dropped out of the intended drop area to interfere
     this.attachment.initAttachmentDialog('fineuploader', 'fineuploader_button', {
       uiChanged: () => {
         this.view.sizeModule.setInputTextHeightManuallyIfNeeded();

diff --git a/extension/chrome/elements/compose-modules/compose-recipients-module.ts b/extension/chrome/elements/compose-modules/compose-recipients-module.ts
@@ -108,9 +108,18 @@ export class ComposeRecipientsModule extends ViewModule<ComposeView> {
         this.view.S.cached('input_to').trigger('focus');
       })
     );
-    this.view.S.cached('input_to').focus(this.view.setHandler(() => this.focusRecipients()));
-    this.view.S.cached('cc').focus(this.view.setHandler(() => this.focusRecipients()));
-    this.view.S.cached('bcc').focus(this.view.setHandler(() => this.focusRecipients()));
+    this.view.S.cached('input_to').on(
+      'focus',
+      this.view.setHandler(() => this.focusRecipients())
+    );
+    this.view.S.cached('cc').on(
+      'focus',
+      this.view.setHandler(() => this.focusRecipients())
+    );
+    this.view.S.cached('bcc').on(
+      'focus',
+      this.view.setHandler(() => this.focusRecipients())
+    );
     this.view.S.cached('compose_table').on(
       'click',
       this.view.setHandler(() => this.hideContacts(), this.view.errModule.handle(`hide contact box`))
@@ -568,7 +577,7 @@ export class ComposeRecipientsModule extends ViewModule<ComposeView> {
         }
       }
       return false;
-    } else if (e.keyCode === 32) {
+    } else if (e.key === 'Space') {
       // Handle 'Space' key
       const target = $(e.target);
       const emails = String(target.val())
@@ -808,7 +817,7 @@ export class ComposeRecipientsModule extends ViewModule<ComposeView> {
           displayEmail = contact.email;
         } else {
           const parts = contact.email.split('@');
-          displayEmail = parts[0].replace(/<\/?b>/g, '').substr(0, 10) + '...@' + parts[1];
+          displayEmail = parts[0].replace(/<\/?b>/g, '').substring(0, 10) + '...@' + parts[1];
         }
         displayEmail = '<div class="select_contact_email" data-test="action-select-contact-email">' + Xss.escape(displayEmail) + '</div>';
         if (contact.name) {
@@ -835,7 +844,7 @@ export class ComposeRecipientsModule extends ViewModule<ComposeView> {
           this.view.errModule.handle(`select contact`)
         )
       );
-      contactItems.hover(function () {
+      contactItems.on('hover', function () {
         contactItems.removeClass('active');
         $(this).addClass('active');
       });

diff --git a/extension/chrome/elements/compose-modules/compose-render-module.ts b/extension/chrome/elements/compose-modules/compose-render-module.ts
@@ -371,12 +371,13 @@ export class ComposeRenderModule extends ViewModule<ComposeView> {
   };
 
   private addComposeTableHandlers = async () => {
-    this.view.S.cached('body').keydown(
+    this.view.S.cached('body').on(
+      'keydown',
       this.view.setHandler((el, ev) => {
         this.onBodyKeydownHandler(el, ev);
       })
     );
-    this.view.S.cached('input_to').bind(
+    this.view.S.cached('input_to').on(
       'paste',
       this.view.setHandler((el, ev) => this.onRecipientPasteHandler(el, ev))
     );
@@ -391,7 +392,7 @@ export class ComposeRenderModule extends ViewModule<ComposeView> {
       .children()
       .on('click', () => false);
     this.view.S.cached('input_subject')
-      .bind(
+      .on(
         'input',
         this.view.setHandler((el: HTMLInputElement) => {
           this.subjectRTLHandler(el);

diff --git a/extension/chrome/elements/compose-modules/compose-reply-btn-popover-module.ts b/extension/chrome/elements/compose-modules/compose-reply-btn-popover-module.ts
@@ -69,7 +69,7 @@ export class ComposeReplyBtnPopoverModule extends ViewModule<ComposeView> {
     if (replyContainer.hasClass('popover-opened')) {
       $('body').on('click', popoverClickHandler);
       const replyOptions = this.view.S.cached('reply_options_container').find('.reply-option');
-      replyOptions.hover(function () {
+      replyOptions.on('hover', function () {
         replyOptions.removeClass('active');
         $(this).addClass('active');
       });

diff --git a/extension/chrome/elements/compose-modules/compose-send-btn-module.ts b/extension/chrome/elements/compose-modules/compose-send-btn-module.ts
@@ -37,7 +37,7 @@ export class ComposeSendBtnModule extends ViewModule<ComposeView> {
 
   public setHandlers = (): void => {
     const ctrlEnterHandler = Ui.ctrlEnter(() => !this.view.sizeModule.composeWindowIsMinimized && this.extractProcessSendMsg());
-    this.view.S.cached('subject').add(this.view.S.cached('compose')).keydown(ctrlEnterHandler);
+    this.view.S.cached('subject').add(this.view.S.cached('compose')).on('keydown', ctrlEnterHandler);
     this.view.S.cached('send_btn').on(
       'click',
       this.view.setHandlerPrevent('double', () => this.extractProcessSendMsg())

diff --git a/extension/chrome/elements/compose-modules/compose-send-btn-popover-module.ts b/extension/chrome/elements/compose-modules/compose-send-btn-popover-module.ts
@@ -115,7 +115,7 @@ export class ComposeSendBtnPopoverModule extends ViewModule<ComposeView> {
         this.view.setHandler(async (target, e) => this.keydownHandler(e))
       );
       const sendingOptions = this.view.S.cached('sending_options_container').find('.sending-option');
-      sendingOptions.hover(function () {
+      sendingOptions.on('hover', function () {
         sendingOptions.removeClass('active');
         $(this).addClass('active');
       });

diff --git a/extension/chrome/elements/compose-modules/compose-sender-module.ts b/extension/chrome/elements/compose-modules/compose-sender-module.ts
@@ -51,10 +51,13 @@ export class ComposeSenderModule extends ViewModule<ComposeView> {
       const fmtOpt = (addr: string) => `<option value="${Xss.escape(addr)}" ${this.getSender() === addr ? 'selected' : ''}>${Xss.escape(addr)}</option>`;
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
       emailAliases.sort((a, b) => (sendAs![a].isDefault === sendAs![b].isDefault ? 0 : sendAs![a].isDefault ? -1 : 1));
-      Xss.sanitizeRender(fromContainer.find('#input_from'), emailAliases.map(fmtOpt).join('')).change(() =>
+      Xss.sanitizeRender(fromContainer.find('#input_from'), emailAliases.map(fmtOpt).join('')).on('change', () =>
         this.view.myPubkeyModule.reevaluateShouldAttachOrNot()
       );
-      this.view.S.now('input_from').change(this.view.setHandler(() => this.actionInputFromChangeHandler()));
+      this.view.S.now('input_from').on(
+        'change',
+        this.view.setHandler(() => this.actionInputFromChangeHandler())
+      );
       if (this.view.isReplyBox) {
         this.view.sizeModule.resizeComposeBox();
       }

diff --git a/extension/chrome/elements/passphrase.ts b/extension/chrome/elements/passphrase.ts
@@ -119,7 +119,10 @@ View.run(
     };
 
     public setHandlers = () => {
-      $('#passphrase').keyup(this.setHandler(() => this.renderNormalPpPrompt()));
+      $('#passphrase').on(
+        'keyup',
+        this.setHandler(() => this.renderNormalPpPrompt())
+      );
       $('.action_close').on(
         'click',
         this.setHandler(() => this.closeDialog())
@@ -165,7 +168,8 @@ View.run(
           );
         })
       );
-      $('#passphrase').keydown(
+      $('#passphrase').on(
+        'keydown',
         this.setHandler((el, ev) => {
           if (ev.key === 'Enter') {
             $('.action_ok').trigger('click');

diff --git a/extension/chrome/elements/pgp_pubkey.ts b/extension/chrome/elements/pgp_pubkey.ts
@@ -127,7 +127,10 @@ View.run(
         'click',
         this.setHandler(btn => this.addContactHandler(btn))
       );
-      $('.input_email').keyup(this.setHandler(() => this.setBtnText()));
+      $('.input_email').on(
+        'keyup',
+        this.setHandler(() => this.setBtnText())
+      );
       $('.action_show_full').on(
         'click',
         this.setHandler(btn => this.showFullKeyHandler(btn))

diff --git a/extension/chrome/settings/index.ts b/extension/chrome/settings/index.ts
@@ -70,6 +70,7 @@ View.run(
     }
 
     public render = async () => {
+      // eslint-disable-next-line @typescript-eslint/no-deprecated
       const isDevMode = !('update_url' in chrome.runtime.getManifest());
       $('#status-row #status_version').text(`v:${VERSION}${isDevMode ? '-dev' : ''}`);
       for (const webmailLName of await Env.webmails()) {
@@ -222,7 +223,8 @@ View.run(
           }, 500);
         })
       );
-      this.altAccounts.keydown(
+      this.altAccounts.on(
+        'keydown',
         this.setHandler((el, ev) => {
           this.accountsMenuKeydownHandler(ev);
         })

diff --git a/extension/chrome/settings/modules/add_key.ts b/extension/chrome/settings/modules/add_key.ts
@@ -72,7 +72,7 @@ export class AddKeyView extends View {
 
   public setHandlers = () => {
     $('.action_add_private_key').on('click', this.setHandlerPrevent('double', this.addPrivateKeyHandler));
-    $('#input_passphrase').keydown(this.setEnterHandlerThatClicks('.action_add_private_key'));
+    $('#input_passphrase').on('keydown', this.setEnterHandlerThatClicks('.action_add_private_key'));
     this.addKeyGenerateModule.setHandlers();
   };
 

diff --git a/extension/chrome/settings/modules/compatibility.ts b/extension/chrome/settings/modules/compatibility.ts
@@ -34,7 +34,7 @@ View.run(
     public setHandlers = () => {
       $('.action_load_public_key').on('click', this.setHandlerPrevent('double', this.actionLoadPublicKey));
       $('.action_test_key').on('click', this.setHandlerPrevent('double', this.actionTestKeyHandler));
-      $('#input_passphrase').keydown(this.setEnterHandlerThatClicks('.action_test_key'));
+      $('#input_passphrase').on('keydown', this.setEnterHandlerThatClicks('.action_test_key'));
     };
 
     private performKeyCompatibilityTests = async (keyString: string) => {

diff --git a/extension/chrome/settings/modules/contacts.ts b/extension/chrome/settings/modules/contacts.ts
@@ -60,7 +60,7 @@ View.run(
       $('#bulk_import .action_process').off().on('click', this.setHandlerPrevent('double', this.actionProcessBulkImportTextInput));
       $('.action_export_all').off().on('click', this.setHandlerPrevent('double', this.actionExportAllKeysHandler));
       $('.action_view_bulk_import').off().on('click', this.setHandlerPrevent('double', this.actionRenderBulkImportPageHandler));
-      $('.input-search-contacts').off().keyup(this.setHandlerPrevent('double', this.loadAndRenderContactList));
+      $('.input-search-contacts').off().on('keyup', this.setHandlerPrevent('double', this.loadAndRenderContactList));
     };
 
     // --- PRIVATE

diff --git a/extension/chrome/settings/modules/my_key_update.ts b/extension/chrome/settings/modules/my_key_update.ts
@@ -82,7 +82,7 @@ View.run(
         'click',
         this.setHandlerPrevent('double', () => this.updatePrivateKeyHandler())
       );
-      $('.input_passphrase').keydown(this.setEnterHandlerThatClicks('.action_update_private_key'));
+      $('.input_passphrase').on('keydown', this.setEnterHandlerThatClicks('.action_update_private_key'));
     };
 
     private storeUpdatedKeyAndPassphrase = async (updatedPrv: Key, updatedPrvPassphrase: string) => {

diff --git a/extension/chrome/settings/modules/security.ts b/extension/chrome/settings/modules/security.ts
@@ -58,8 +58,14 @@ View.run(
           Settings.redirectSubPage(this.acctEmail, this.parentTabId, '/chrome/settings/modules/test_passphrase.htm');
         })
       );
-      $('#hide_message_password').change(this.setHandler(el => this.hideMsgPasswordHandler(el)));
-      $('.password_message_language').change(this.setHandler(() => this.onMsgLanguageUserChange()));
+      $('#hide_message_password').on(
+        'change',
+        this.setHandler(el => this.hideMsgPasswordHandler(el))
+      );
+      $('.password_message_language').on(
+        'change',
+        this.setHandler(() => this.onMsgLanguageUserChange())
+      );
     };
 
     private renderPassPhraseOptionsIfStoredPermanently = async () => {
@@ -91,7 +97,7 @@ View.run(
         $('.cancel_passphrase_requirement_change').on('click', () => {
           window.location.reload();
         });
-        $('#passphrase_entry').keydown(this.setEnterHandlerThatClicks('.confirm_passphrase_requirement_change'));
+        $('#passphrase_entry').on('keydown', this.setEnterHandlerThatClicks('.confirm_passphrase_requirement_change'));
       }
     };
 

diff --git a/extension/js/common/api/authentication/configured-idp-oauth.ts b/extension/js/common/api/authentication/configured-idp-oauth.ts
@@ -100,6 +100,7 @@ export class ConfiguredIdpOAuth extends OAuth {
           grant_type: 'refresh_token',
           refreshToken,
           client_id: authConf.oauth.clientId,
+          // eslint-disable-next-line @typescript-eslint/no-deprecated
           redirect_uri: chrome.identity.getRedirectURL('oauth'),
         },
         dataType: 'JSON',
@@ -119,6 +120,7 @@ export class ConfiguredIdpOAuth extends OAuth {
       access_type: 'offline',
       prompt: 'login',
       state,
+      // eslint-disable-next-line @typescript-eslint/no-deprecated
       redirect_uri: chrome.identity.getRedirectURL('oauth'),
       scope: this.OAUTH_REQUEST_SCOPES.join(' '),
       login_hint: acctEmail,
@@ -129,7 +131,9 @@ export class ConfiguredIdpOAuth extends OAuth {
   private static async getAuthRes({ acctEmail, expectedState, authUrl }: { acctEmail: string; expectedState: string; authUrl: string }): Promise<AuthRes> {
     /* eslint-disable @typescript-eslint/naming-convention */
     try {
+      // eslint-disable-next-line @typescript-eslint/no-deprecated
       const redirectUri = await chrome.identity.launchWebAuthFlow({ url: authUrl, interactive: true });
+      // eslint-disable-next-line @typescript-eslint/no-deprecated
       if (chrome.runtime.lastError || !redirectUri || redirectUri?.includes('access_denied')) {
         return { acctEmail, result: 'Denied', error: `Failed to launch web auth flow`, id_token: undefined };
       }
@@ -203,6 +207,7 @@ export class ConfiguredIdpOAuth extends OAuth {
           grant_type: 'authorization_code',
           code,
           client_id: authConf.oauth.clientId,
+          // eslint-disable-next-line @typescript-eslint/no-deprecated
           redirect_uri: chrome.identity.getRedirectURL('oauth'),
         },
         dataType: 'JSON',

diff --git a/extension/js/common/api/authentication/google/google-oauth.ts b/extension/js/common/api/authentication/google/google-oauth.ts
@@ -88,6 +88,7 @@ export class GoogleOAuth extends OAuth {
     const performAjaxRequest = async <RT>(req: Ajax): Promise<RT> => {
       // temporary use jquery for upload requests https://github.com/FlowCrypt/flowcrypt-browser/issues/5612
       if (req.progress?.upload) {
+        // eslint-disable-next-line @typescript-eslint/no-deprecated
         return (await Api.ajaxWithJquery(req, 'json')) as RT;
       } else {
         return (await Api.ajax(req, 'json')) as RT;

diff --git a/extension/js/common/api/flowcrypt-website.ts b/extension/js/common/api/flowcrypt-website.ts
@@ -30,7 +30,7 @@ export class FlowCryptWebsite extends Api {
     for (const post of Browser.arrFromDomNodeList(xml.querySelectorAll('entry'))) {
       const children = Browser.arrFromDomNodeList(post.childNodes);
       const title = children.find(n => n.nodeName.toLowerCase() === 'title')?.textContent;
-      const date = children.find(n => n.nodeName.toLowerCase() === 'published')?.textContent?.substr(0, 10);
+      const date = children.find(n => n.nodeName.toLowerCase() === 'published')?.textContent?.substring(0, 10);
       const url = (children.find(n => n.nodeName.toLowerCase() === 'link') as HTMLAnchorElement).getAttribute('href');
       if (title && date && url) {
         posts.push({ title, date, url });

diff --git a/extension/js/common/api/shared/api-error.ts b/extension/js/common/api/shared/api-error.ts
@@ -96,8 +96,8 @@ export class AjaxErr extends ApiCallErr {
     const status = resCode || (typeof xhr.status === 'number' ? xhr.status : -1);
     if (status === 400 || status === 403 || (status === 200 && responseText && !responseText.startsWith('{'))) {
       // RawAjaxErr with status 200 can happen when it fails to parse response - eg non-json result
-      const redactedRes = AjaxErr.redactSensitiveData(responseText.substr(0, 1000));
-      const redactedPayload = AjaxErr.redactSensitiveData(Catch.stringify(req.data).substr(0, 1000));
+      const redactedRes = AjaxErr.redactSensitiveData(responseText.substring(0, 1000));
+      const redactedPayload = AjaxErr.redactSensitiveData(Catch.stringify(req.data).substring(0, 1000));
       stack += `\n\nresponseText(0, 1000):\n${redactedRes}\n\npayload(0, 1000):\n${redactedPayload}`;
     }
     const message = `${String(xhr.statusText || '(no status text)')}: ${String(xhr.status || -1)} when ${ApiCallErr.describeApiAction(req)} -> ${

diff --git a/extension/js/common/api/shared/api.ts b/extension/js/common/api/shared/api.ts
@@ -410,6 +410,7 @@ export class Api {
       // as of October 2023 fetch upload progress (through ReadableStream)
       // is supported only by Chrome and requires HTTP/2 on backend
       // as temporary solution we use XMLHTTPRequest for such requests
+      // eslint-disable-next-line @typescript-eslint/no-deprecated
       const result = await Api.ajaxWithJquery(req, resFmt, formattedData);
       return result as FetchResult<T, RT>;
     } else {