fix: migrate webextension-polyfill-ts to Mozilla's (#1723)

package.json

@@ -119,7 +119,7 @@
     "uuid": "^9.0.0",
     "web3-eth-abi": "^1.7.0",
     "web3-utils": "^1.7.0",
-    "webextension-polyfill-ts": "^0.25.0"
+    "webextension-polyfill": "^0.10.0"
   },
   "devDependencies": {
     "@sentry/webpack-plugin": "^1.18.9",
@@ -135,6 +135,7 @@
     "@types/react-router-dom": "^5.1.7",
     "@types/semver-compare": "^1.0.1",
     "@types/sinon": "^10.0.13",
+    "@types/webextension-polyfill": "^0.10.2",
     "@typescript-eslint/eslint-plugin": "^5.13.0",
     "@typescript-eslint/parser": "^4.22.1",
     "@welldone-software/why-did-you-render": "^6.2.1",

src/background/index.ts

@@ -1,7 +1,7 @@
 import { groupBy } from 'lodash';
 import 'reflect-metadata';
 import * as Sentry from '@sentry/browser';
-import { browser } from 'webextension-polyfill-ts';
+import browser from 'webextension-polyfill';
 import { ethErrors } from 'eth-rpc-errors';
 import { WalletController } from 'background/controller/wallet';
 import { Message } from '@/utils';

src/background/service/keyring/eth-bitbox02-keyring.ts

@@ -1,6 +1,6 @@
 import 'regenerator-runtime/runtime';
 import EventEmitter from 'events';
-import { browser } from 'webextension-polyfill-ts';
+import browser from 'webextension-polyfill';
 
 import { BitBox02API, getDevicePath, constants } from 'bitbox02-api';
 

src/background/service/notification.ts

@@ -1,4 +1,4 @@
-import { Windows, browser } from 'webextension-polyfill-ts';
+import browser, { Windows } from 'webextension-polyfill';
 import Events from 'events';
 import { ethErrors } from 'eth-rpc-errors';
 import { v4 as uuidv4 } from 'uuid';

src/background/service/preference.ts

@@ -9,7 +9,7 @@ import {
 } from './index';
 import { TotalBalanceResponse, TokenItem } from './openapi';
 import { HARDWARE_KEYRING_TYPES, EVENTS, CHAINS_ENUM, LANGS } from 'consts';
-import { browser } from 'webextension-polyfill-ts';
+import browser from 'webextension-polyfill';
 import semver from 'semver-compare';
 
 const version = process.env.release || '0';

src/background/webapi/notification.ts

@@ -1,4 +1,4 @@
-import { browser } from 'webextension-polyfill-ts';
+import browser from 'webextension-polyfill';
 import { createTab } from './tab';
 
 browser.notifications.onClicked.addListener((url) => {
@@ -17,7 +17,7 @@ const create = (
   browser.notifications.create(url && `${url}_randomId_=${randomId}`, {
     type: 'basic',
     title,
-    iconUrl: browser.extension.getURL('./images/icon-64.png'),
+    iconUrl: browser.runtime.getURL('./images/icon-64.png'),
     message,
     priority,
   });

src/background/webapi/storage.ts

@@ -1,4 +1,4 @@
-import { browser } from 'webextension-polyfill-ts';
+import browser from 'webextension-polyfill';
 
 let cacheMap;
 

src/background/webapi/tab.ts

@@ -1,4 +1,4 @@
-import { browser } from 'webextension-polyfill-ts';
+import browser from 'webextension-polyfill';
 import { EventEmitter } from 'events';
 
 const tabEvent = new EventEmitter();

src/background/webapi/window.ts

@@ -1,4 +1,4 @@
-import { browser, Windows } from 'webextension-polyfill-ts';
+import browser, { Windows } from 'webextension-polyfill';
 import { EventEmitter } from 'events';
 import { IS_WINDOWS } from 'consts';
 

src/content-script/index.ts

@@ -1,6 +1,5 @@
 import { Message } from '@/utils';
 import { nanoid } from 'nanoid';
-import { browser } from 'webextension-polyfill-ts';
 
 const channelName = nanoid();
 

src/ui/utils/webapi.ts

@@ -1,4 +1,4 @@
-import { Tabs, browser, Windows } from 'webextension-polyfill-ts';
+import browser, { Tabs, Windows } from 'webextension-polyfill';
 import { WalletController, WalletControllerType } from './index';
 import { getOriginFromUrl } from '@/utils';
 

src/utils/index.ts

@@ -1,6 +1,6 @@
 import { CHAINS } from '@/constant';
 import { keyBy } from 'lodash';
-import { browser } from 'webextension-polyfill-ts';
+import browser from 'webextension-polyfill';
 import { ledgerUSBVendorId } from '@ledgerhq/devices';
 
 import BroadcastChannelMessage from './message/broadcastChannelMessage';

src/utils/ledger.ts

@@ -1,7 +1,7 @@
 import { ledgerUSBVendorId } from '@ledgerhq/devices';
 import { useEffect, useState } from 'react';
 import { hasConnectedLedgerDevice } from '@/utils';
-import { browser } from 'webextension-polyfill-ts';
+import browser from 'webextension-polyfill';
 
 export enum LedgerHDPathType {
   LedgerLive = 'LedgerLive',

src/utils/matomo-request.ts

@@ -1,5 +1,5 @@
 import { customAlphabet, nanoid } from 'nanoid';
-import { browser } from 'webextension-polyfill-ts';
+import browser from 'webextension-polyfill';
 
 const ANALYTICS_PATH = 'https://matomo.debank.com/matomo.php';
 const genExtensionId = customAlphabet('1234567890abcdef', 16);

src/utils/message/portMessage.ts

@@ -1,4 +1,4 @@
-import { Runtime, browser } from 'webextension-polyfill-ts';
+import browser, { Runtime } from 'webextension-polyfill';
 import Message from './index';
 class PortMessage extends Message {
   port: Runtime.Port | null = null;

yarn.lock

@@ -4702,6 +4702,11 @@
   resolved "https://registry.yarnpkg.com/@types/web/-/web-0.0.80.tgz#bbf499be42b0e4ec1c417b89fde51e5afe062044"
   integrity sha512-HLbRwqCL5VVkmpAAzqRGXDkUO4teKhOOY2FJDHQl3k5OTuDTPzkI74AJSoGaS6oHOVVYhI/X5Ahw/ltC8KZQuw==
 
+"@types/webextension-polyfill@^0.10.2":
+  version "0.10.2"
+  resolved "https://registry.yarnpkg.com/@types/webextension-polyfill/-/webextension-polyfill-0.10.2.tgz#14175d96d76339fce4d2b9b7837846148296cb5a"
+  integrity sha512-L+T72DVTi/1azY6gw7PRmL49kvobLKQQWfOmHDBRSCkAvaCV4wk222J3ZODYA9Gf/UqUvtItu8FPJgWX5ktO9g==
+
 "@types/ws@^7.2.0":
   version "7.4.7"
   resolved "https://registry.yarnpkg.com/@types/ws/-/ws-7.4.7.tgz#f7c390a36f7a0679aa69de2d501319f4f8d9b702"
@@ -14871,24 +14876,17 @@ web3-utils@^1.6.0:
     randombytes "^2.1.0"
     utf8 "3.0.0"
 
-webextension-polyfill-ts@^0.25.0:
-  version "0.25.0"
-  resolved "https://registry.yarnpkg.com/webextension-polyfill-ts/-/webextension-polyfill-ts-0.25.0.tgz#fff041626365dbd0e29c40b197e989a55ec221ca"
-  integrity sha512-ikQhwwHYkpBu00pFaUzIKY26I6L87DeRI+Q6jBT1daZUNuu8dSrg5U9l/ZbqdaQ1M/TTSPKeAa3kolP5liuedw==
-  dependencies:
-    webextension-polyfill "^0.7.0"
-
 webextension-polyfill-ts@^0.26.0:
   version "0.26.0"
   resolved "https://registry.yarnpkg.com/webextension-polyfill-ts/-/webextension-polyfill-ts-0.26.0.tgz#80b7063ddaf99abaa1ca73aad0cec09f306612d3"
   integrity sha512-XEFL+aYVEsm/d4RajVwP75g56c/w2aSHnPwgtUv8/nCzbLNSzRQIix6aj1xqFkA5yr7OIDkk3OD/QTnPp8ThYA==
   dependencies:
     webextension-polyfill "^0.8.0"
 
-webextension-polyfill@^0.7.0:
-  version "0.7.0"
-  resolved "https://registry.yarnpkg.com/webextension-polyfill/-/webextension-polyfill-0.7.0.tgz#0df1120ff0266056319ce1a622b09ad8d4a56505"
-  integrity sha512-su48BkMLxqzTTvPSE1eWxKToPS2Tv5DLGxKexLEVpwFd6Po6N8hhSLIvG6acPAg7qERoEaDL+Y5HQJeJeml5Aw==
+webextension-polyfill@^0.10.0:
+  version "0.10.0"
+  resolved "https://registry.yarnpkg.com/webextension-polyfill/-/webextension-polyfill-0.10.0.tgz#ccb28101c910ba8cf955f7e6a263e662d744dbb8"
+  integrity sha512-c5s35LgVa5tFaHhrZDnr3FpQpjj1BB+RXhLTYUxGqBVN460HkbM8TBtEqdXWbpTKfzwCcjAZVF7zXCYSKtcp9g==
 
 webextension-polyfill@^0.8.0:
   version "0.8.0"