Merge branch 'feat/firefox' into tmp/20241108

.eslintignore

@@ -1,5 +1,6 @@
 build/*
 dist/*
+dist-mv2/*
 *.config.js
 _raw/*
 webpack.config.js

_raw/locales/en/messages.json

@@ -1423,6 +1423,7 @@
         "description": "Importing multiple QR-based hardware wallets is not supported. Please delete all addresses from {{0}} before importing another device."
       },
       "connectHardwareWallets": "Connect Hardware Wallets",
+      "firefoxLedgerDisableTips": "Ledger is not compatible with Firefox",
       "connectMobileWalletApps": "Connect Mobile Wallet Apps",
       "connectInstitutionalWallets": "Connect Institutional Wallets",
       "createNewSeedPhrase": "Create New Seed Phrase",

_raw/locales/zh-CN/messages.json

@@ -407,6 +407,7 @@
         "description": "不支持导入多个基于二维码的硬件钱包。\n请先删除 {{0}} 中的所有地址，然后再导入新的设备"
       },
       "connectHardwareWallets": "连接硬件钱包",
+      "firefoxLedgerDisableTips": "Ledger和Firefox不兼容",
       "connectMobileWalletApps": "连接手机钱包",
       "connectInstitutionalWallets": "连接机构钱包",
       "createNewSeedPhrase": "创建新的助记词",

build/clean.js

@@ -0,0 +1,17 @@
+const { exec } = require('child_process');
+
+const MANIFEST_TYPE = process.env.MANIFEST_TYPE || 'chrome-mv3';
+
+exec(
+  MANIFEST_TYPE.endsWith('-mv2') 
+    ? 
+    'mkdir -p dist-mv2 && rm -rf dist-mv2/*' 
+    : 
+    'mkdir -p dist && rm -rf dist/*', 
+  (error) => {
+    if (error) {
+      console.error(`exec error: ${error}`);
+      return;
+    }
+  }
+);

build/paths.js

@@ -14,6 +14,7 @@ module.exports = {
   backgroundHtml: rootResolve('src/background/background.html'),
   offscreenHtml: rootResolve('src/offscreen/offscreen.html'),
   dist: rootResolve('dist'),
+  distMv2: rootResolve('dist-mv2'),
 
   rootResolve,
 };

build/release.js

@@ -18,15 +18,15 @@ function updateManifestVersion(version, p) {
   fs.writeJSONSync(manifestPath, manifest, { spaces: 2 });
 }
 
-async function release([version, isDebug, isRelease]) {
+async function release([version, isDebug, isRelease, isMV3]) {
   if (isRelease) {
     shell.exec(`npm version ${version} --force`);
     shell.exec('git add -A');
     shell.exec(`git commit -m "[release] ${version}"`);
     shell.exec(`git push origin refs/tags/v${version}`);
     shell.exec('git push origin master');
   }
-  return [version, isDebug, isRelease];
+  return [version, isDebug, isRelease, isMV3];
 }
 
 async function bundle() {
@@ -56,21 +56,23 @@ async function bundle() {
 
   const buildStr = isDebug ? 'build:debug' : 'build:pro';
 
-  updateManifestVersion(version, 'mv3');
-  updateManifestVersion(version, 'mv2');
+  updateManifestVersion(version, 'chrome-mv3');
+  updateManifestVersion(version, 'chrome-mv2');
+  updateManifestVersion(version, 'firefox-mv2');
   // shell.env['sourcemap'] = true;
   if (isMV3) {
     shell.exec(`cross-env VERSION=${version} yarn ${buildStr}`);
   } else {
     shell.exec(`cross-env VERSION=${version} yarn ${buildStr}:mv2`);
   }
   shell.rm('-rf', './dist/*.js.map');
-  return [version, isDebug, isRelease];
+  shell.rm('-rf', './dist-mv2/*.js.map');
+  return [version, isDebug, isRelease, isMV3];
 }
-async function packed([version, isDebug]) {
+async function packed([version, isDebug,, isMV3]) {
   import('./zip.mjs').then((re) => {
     re.createZipTask(
-      'dist/**',
+      isMV3 ? 'dist/**' : 'dist-mv2/**',
       `Rabby_v${version}${isDebug ? '_debug' : ''}.zip`
     );
   });

build/webpack.common.config.js

@@ -30,6 +30,11 @@ const {
   minify: false, // it's still an experimental feature
   componentIdPrefix: 'rabby-',
 });
+// 'chrome-mv2', 'chrome-mv3', 'firefox-mv2', 'firefox-mv3'
+const MANIFEST_TYPE = process.env.MANIFEST_TYPE || 'chrome-mv2';
+const IS_MANIFEST_MV3 = MANIFEST_TYPE.includes('-mv3');
+const FINAL_DIST = IS_MANIFEST_MV3 ? paths.dist : paths.distMv2;
+const IS_FIREFOX = MANIFEST_TYPE.includes('firefox');
 
 const config = {
   entry: {
@@ -42,7 +47,7 @@ const config = {
     offscreen: paths.rootResolve('src/offscreen/scripts/offscreen.ts'),
   },
   output: {
-    path: paths.dist,
+    path: FINAL_DIST,
     filename: '[name].js',
     publicPath: '/',
   },
@@ -198,25 +203,27 @@ const config = {
     new HtmlWebpackPlugin({
       inject: true,
       template: paths.popupHtml,
-      chunks: ['ui'],
+      chunks: ['ui', 'ui-vender'],
       filename: 'popup.html',
     }),
     new HtmlWebpackPlugin({
       inject: true,
       template: paths.notificationHtml,
-      chunks: ['ui'],
+      chunks: ['ui', 'ui-vender'],
       filename: 'notification.html',
     }),
     new HtmlWebpackPlugin({
       inject: true,
       template: paths.indexHtml,
-      chunks: ['ui'],
+      chunks: ['ui', 'ui-vender'],
       filename: 'index.html',
     }),
     new HtmlWebpackPlugin({
       inject: true,
       template: paths.backgroundHtml,
-      chunks: ['background'],
+      chunks: ['background'].concat(
+        IS_FIREFOX ? ['bg-chunk1', 'bg-chunk2', 'bg-chunk3'] : []
+      ),
       filename: 'background.html',
     }),
     new HtmlWebpackPlugin({
@@ -238,45 +245,49 @@ const config = {
     }),
     new CopyPlugin({
       patterns: [
-        { from: paths.rootResolve('_raw'), to: paths.rootResolve('dist') },
+        { from: paths.rootResolve('_raw'), to: FINAL_DIST },
         {
-          from: process.env.ENABLE_MV3
-            ? paths.rootResolve('src/manifest/mv3/manifest.json')
-            : paths.rootResolve('src/manifest/mv2/manifest.json'),
-          to: paths.dist,
+          from: paths.rootResolve(
+            `src/manifest/${MANIFEST_TYPE}/manifest.json`
+          ),
+          to: FINAL_DIST,
         },
-        process.env.ENABLE_MV3
+        IS_MANIFEST_MV3
           ? {
               from: require.resolve(
                 '@trezor/connect-webextension/build/content-script.js'
               ),
-              to: paths.rootResolve(
-                'dist/vendor/trezor/trezor-content-script.js'
+              to: path.resolve(
+                FINAL_DIST,
+                './vendor/trezor/trezor-content-script.js'
               ),
             }
           : {
               from: require.resolve(
                 '@trezor/connect-web/lib/webextension/trezor-content-script.js'
               ),
-              to: paths.rootResolve(
-                'dist/vendor/trezor/trezor-content-script.js'
+              to: path.resolve(
+                FINAL_DIST,
+                './vendor/trezor/trezor-content-script.js'
               ),
             },
-        process.env.ENABLE_MV3
+        IS_MANIFEST_MV3
           ? {
               from: require.resolve(
                 '@trezor/connect-webextension/build/trezor-connect-webextension.js'
               ),
-              to: paths.rootResolve(
-                'dist/vendor/trezor/trezor-connect-webextension.js'
+              to: path.resolve(
+                FINAL_DIST,
+                './vendor/trezor/trezor-connect-webextension.js'
               ),
             }
           : {
               from: require.resolve(
                 '@trezor/connect-web/lib/webextension/trezor-usb-permissions.js'
               ),
-              to: paths.rootResolve(
-                'dist/vendor/trezor/trezor-usb-permissions.js'
+              to: path.resolve(
+                FINAL_DIST,
+                './vendor/trezor/trezor-usb-permissions.js'
               ),
             },
       ],
@@ -309,6 +320,32 @@ const config = {
           name: 'webextension-polyfill',
           chunks: 'all',
         },
+        ...(IS_FIREFOX && {
+          bgChunk1: {
+            test: /[\\/]node_modules[\\/](@rabby-wallet|ethers|@ethersproject|@chainsafe|@trezor|@safe-global|@walletconnect)[\\/]/,
+            name: 'bg-chunk1',
+            chunks: (chunk) => chunk.name === 'background',
+            minSize: 0,
+          },
+          bgChunk2: {
+            test: /[\\/]node_modules[\\/](@keystonehq|@eth-optimism|@coinbase|gridplus-sdk)[\\/]/,
+            name: 'bg-chunk2',
+            chunks: (chunk) => chunk.name === 'background',
+            minSize: 0,
+          },
+          bgChunk3: {
+            test: /[\\/]node_modules[\\/](@imkey|@onekeyfe|@ethereumjs|viem|@metamask)[\\/]/,
+            name: 'bg-chunk3',
+            chunks: (chunk) => chunk.name === 'background',
+            minSize: 0,
+          },
+        }),
+        uiVender: {
+          test: /[\\/]node_modules[\\/]/,
+          name: 'ui-vender',
+          chunks: (chunk) => chunk.name === 'ui',
+          minSize: 0,
+        },
       },
     },
   },

package.json

@@ -3,17 +3,17 @@
   "version": "0.92.97",
   "description": "A browser plugin for DeFi users",
   "scripts": {
-    "clean": "mkdir -p dist && rm -rf dist/*",
+    "clean": "node build/clean.js",
     "make-theme": "node ./scripts/make-theme.js",
     "build:dev:default": "npm run clean && npm run make-theme && cross-env TAILWIND_MODE=watch webpack --progress --env config=dev",
     "build:pro:default": "npm run clean && npm run make-theme && webpack --progress --env config=pro",
     "build:debug:default": "npm run clean && npm run make-theme && webpack --progress --env config=debug",
-    "build:dev:mv2": "npm run build:dev:default",
-    "build:pro:mv2": "npm run build:pro:default",
-    "build:debug:mv2": "npm run build:debug:default",
-    "build:dev": "cross-env ENABLE_MV3=true npm run build:dev:default",
-    "build:pro": "cross-env ENABLE_MV3=true npm run build:pro:default",
-    "build:debug": "cross-env ENABLE_MV3=true npm run build:debug:default",
+    "build:dev:mv2": "cross-env MANIFEST_TYPE=firefox-mv2 npm run build:dev:default",
+    "build:pro:mv2": "cross-env MANIFEST_TYPE=firefox-mv2 npm run build:pro:default",
+    "build:debug:mv2": "cross-env MANIFEST_TYPE=firefox-mv2 npm run build:debug:default",
+    "build:dev": "cross-env MANIFEST_TYPE=chrome-mv3 npm run build:dev:default",
+    "build:pro": "cross-env MANIFEST_TYPE=chrome-mv3 npm run build:pro:default",
+    "build:debug": "cross-env MANIFEST_TYPE=chrome-mv3 npm run build:debug:default",
     "build:sourcemap": "npm run clean && npm run make-theme && webpack --progress --env config=sourcemap",
     "sync-chain": "node ./scripts/sync-support-chain.js",
     "lint:fix": "eslint --fix --ext .js,.jsx,.ts,.tsx ./src",

scripts/autobuild.sh

@@ -17,6 +17,7 @@ RABBY_GIT_HASH=$(git rev-parse --short HEAD);
 CURRENT_TIME=$(date +%Y%m%d%H%M%S);
 
 TARGET_FILE=$project_dir/tmp/RabbyDebug-v${VERSION}-${RABBY_GIT_HASH}.zip;
+TARGET_FILE_MV2=$project_dir/tmp/RabbyDebugMV2-v${VERSION}-${RABBY_GIT_HASH}.zip;
 
 echo "[pack] VERSION is $VERSION";
 
@@ -25,22 +26,34 @@ if [ -z $NO_BUILD ]; then
     yarn;
     yarn build:${build_type};
 fi
-echo "[pack] built finished";
+echo "[pack] built mv3 finished";
+
+if [ -z $NO_BUILD ]; then
+    yarn build:${build_type}:mv2;
+fi
+echo "[pack] built mv2 finished";
+
 
 cd $project_dir;
 rm -rf $project_dir/tmp/*.zip && mkdir -p $project_dir/tmp/;
 git_utc0_time_linux=$(TZ=UTC0 git show --quiet --date='format-local:%Y-%m-%dT%H:%M:%S+00:00' --format="%cd")
-node $script_dir/fns.js $project_dir/dist $TARGET_FILE $git_utc0_time_linux;
+node $script_dir/fns.js $project_dir/dist $TARGET_FILE $git_utc0_time_linux true;
+node $script_dir/fns.js $project_dir/dist-mv2 $TARGET_FILE_MV2 $git_utc0_time_linux false;
 
 cd $project_dir;
 
 get_md5 $TARGET_FILE;
 target_md5_value=$last_md5_value;
-echo "[pack] (md5: $TARGET_FILE) $target_md5_value";
+echo "[pack] mv3 (md5: $TARGET_FILE) $target_md5_value";
+
+get_md5 $TARGET_FILE_MV2;
+target_md5_value_mv2=$last_md5_value;
+echo "[pack] mv2 (md5: $TARGET_FILE_MV2) $target_md5_value_mv2";
 
 # upload to storage
 if [ -z $NO_UPLOAD ]; then
     DOWNLOAD_URL="https://download.rabby.io/autobuild/RabbyDebug-$CURRENT_TIME/RabbyDebug-v${VERSION}-${RABBY_GIT_HASH}.zip"
+    DOWNLOAD_URL_MV2="https://download.rabby.io/autobuild/RabbyDebug-$CURRENT_TIME/RabbyDebugMV2-v${VERSION}-${RABBY_GIT_HASH}.zip"
 
     if [ ! -z $CI ]; then
         QUIET_PARASM="--quiet"
@@ -50,12 +63,14 @@ if [ -z $NO_UPLOAD ]; then
 
     echo "[pack] start upload...";
     aws s3 cp $QUIET_PARASM $project_dir/tmp/ s3://$RABBY_BUILD_BUCKET/rabby/autobuild/RabbyDebug-$CURRENT_TIME --recursive --exclude="*" --include "*.zip" --acl public-read
-    echo "[pack] uploaded. DOWNLOAD_URL is $DOWNLOAD_URL";
+    echo "[pack] uploaded. mv3 DOWNLOAD_URL is $DOWNLOAD_URL";
+    echo "[pack] uploaded. mv2 DOWNLOAD_URL is $DOWNLOAD_URL_MV2";
 
     if [ ! -z $notify_lark ]; then
         echo "[pack] update latest link...";
 
         node ./scripts/notify-lark.js "$DOWNLOAD_URL" "$target_md5_value"
+        node ./scripts/notify-lark.js "$DOWNLOAD_URL_MV2" "$target_md5_value_mv2"
     else
         echo "[pack] skip notify.";
     fi

scripts/fns.js

@@ -13,7 +13,8 @@ const chalk = require('chalk');
 async function createConsistentZip(
   srcDir,
   destZip,
-  gitUTC0Time = new Date(1980, 0, 1)
+  gitUTC0Time = new Date(1980, 0, 1),
+  isMV3 = true
 ) {
   fs.mkdirSync(path.dirname(destZip), { recursive: true });
   const output = fs.createWriteStream(destZip, { flags: 'w+' });
@@ -59,7 +60,7 @@ async function createConsistentZip(
 
   for (const item of allItems) {
     const itemPath = path.join(srcDir, item);
-    const itemZipPath = path.join('dist/', item);
+    const itemZipPath = path.join(isMV3 ? 'dist/' : 'dist-mv2/', item);
 
     const stat = fs.statSync(itemPath);
 
@@ -86,7 +87,7 @@ async function createConsistentZip(
   return pReturn;
 }
 
-const [, , srcDir, destZip, gitUTC0Time] = process.argv;
+const [, , srcDir, destZip, gitUTC0Time, isMV3] = process.argv;
 
 console.log(
   `[fns] will pack ${srcDir} to ${destZip} with gitUTC0Time ${gitUTC0Time}`
@@ -111,7 +112,7 @@ async function get_md5_file(filepath) {
   });
 }
 
-createConsistentZip(srcDir, destZip, gitUTC0Time)
+createConsistentZip(srcDir, destZip, gitUTC0Time, isMV3)
   .then(async (result) => {
     const md5Value = await get_md5_file(destZip);
     console.log(`[fns] ZIP file created at ${destZip} (md5: ${chalk.yellow(md5Value)}, size: ${chalk.yellow(result.totalBytes)} bytes)`);