Merge branch 'develop' into jl/fix-gas-fee-polling-hook-background-co…

…nnection
MetaMask · Mar 20, 2024 · d7f223e · d7f223e
2 parents 988285f + 5974f8b
commit d7f223e
Show file tree

Hide file tree

Showing 43 changed files with 1,435 additions and 526 deletions.
diff --git a/lavamoat/browserify/mmi/policy.json b/lavamoat/browserify/mmi/policy.json
@@ -717,7 +717,8 @@
       "packages": {
         "@metamask-institutional/custody-controller": true,
         "@metamask-institutional/sdk": true,
-        "@metamask-institutional/sdk>@metamask-institutional/types": true
+        "@metamask-institutional/sdk>@metamask-institutional/types": true,
+        "gulp-sass>lodash.clonedeep": true
       }
     },
     "@metamask-institutional/institutional-features": {

diff --git a/package.json b/package.json
@@ -236,7 +236,7 @@
   },
   "dependencies": {
     "@babel/runtime": "patch:@babel/runtime@npm%3A7.24.0#~/.yarn/patches/@babel-runtime-npm-7.24.0-7eb1dd11a2.patch",
-    "@blockaid/ppom_release": "^1.4.4",
+    "@blockaid/ppom_release": "^1.4.5",
     "@ensdomains/content-hash": "^2.5.7",
     "@ethereumjs/common": "^3.1.1",
     "@ethereumjs/tx": "^4.1.1",
@@ -253,7 +253,7 @@
     "@material-ui/core": "^4.11.0",
     "@metamask-institutional/custody-controller": "^0.2.22",
     "@metamask-institutional/custody-keyring": "^1.0.10",
-    "@metamask-institutional/extension": "^0.3.16",
+    "@metamask-institutional/extension": "^0.3.17",
     "@metamask-institutional/institutional-features": "^1.2.11",
     "@metamask-institutional/portfolio-dashboard": "^1.4.0",
     "@metamask-institutional/rpc-allowlist": "^1.0.0",

diff --git a/shared/constants/metametrics.ts b/shared/constants/metametrics.ts
@@ -663,7 +663,7 @@ export enum MetaMetricsEventName {
   ///: BEGIN:ONLY_INCLUDE_IF(snaps)
   SnapInstallStarted = 'Snap Install Started',
   SnapInstallFailed = 'Snap Install Failed',
-  SnapInstallRejected = 'Snap Update Rejected',
+  SnapInstallRejected = 'Snap Install Rejected',
   SnapInstalled = 'Snap Installed',
   SnapUninstalled = 'Snap Uninstalled',
   SnapUpdateStarted = 'Snap Update Started',

diff --git a/test/e2e/helpers.js b/test/e2e/helpers.js
@@ -833,16 +833,11 @@ const TEST_SEED_PHRASE_TWO =
 
 // Usually happens when onboarded to make sure the state is retrieved from metamaskState properly, or after txn is made
 const locateAccountBalanceDOM = async (driver, ganacheServer) => {
-  const balance = (await ganacheServer.getFiatBalance()).toLocaleString(
-    undefined,
-    {
-      minimumFractionDigits: 2,
-    },
-  );
+  const balance = await ganacheServer.getBalance();
 
   await driver.findElement({
     css: '[data-testid="eth-overview__primary-currency"]',
-    text: `$ ${balance} USD`,
+    text: `${balance} ETH`,
   });
 };
 

diff --git a/test/e2e/tests/contract-interactions.spec.js b/test/e2e/tests/contract-interactions.spec.js
@@ -1,11 +1,11 @@
-const { strict: assert } = require('assert');
 const {
   defaultGanacheOptions,
   withFixtures,
   openDapp,
   unlockWallet,
   largeDelayMs,
   WINDOW_TITLES,
+  locateAccountBalanceDOM,
 } = require('../helpers');
 
 const { SMART_CONTRACTS } = require('../seeder/smart-contracts');
@@ -25,7 +25,7 @@ describe('Deploy contract and call contract methods', function () {
         smartContract,
         title: this.test.fullTitle(),
       },
-      async ({ driver, contractRegistry }) => {
+      async ({ driver, contractRegistry, ganacheServer }) => {
         const contractAddress = await contractRegistry.getContractAddress(
           smartContract,
         );
@@ -87,10 +87,7 @@ describe('Deploy contract and call contract methods', function () {
         await driver.switchToWindowWithTitle(
           WINDOW_TITLES.ExtensionInFullScreenView,
         );
-        const balance = await driver.findElement(
-          '[data-testid="eth-overview__primary-currency"]',
-        );
-        assert.equal(await balance.getText(), '$37,399.05\nUSD');
+        await locateAccountBalanceDOM(driver, ganacheServer);
       },
     );
   });

diff --git a/test/e2e/tests/incremental-security.spec.js b/test/e2e/tests/incremental-security.spec.js
@@ -112,10 +112,10 @@ describe('Incremental Security', function () {
         // should have the correct amount of eth
         let currencyDisplay = await driver.waitForSelector({
           css: '.currency-display-component__text',
-          text: '$1,700.00',
+          text: '1',
         });
         let balance = await currencyDisplay.getText();
-        assert.strictEqual(balance, '$1,700.00');
+        assert.strictEqual(balance, '1');
 
         // backs up the Secret Recovery Phrase
         // should show a backup reminder
@@ -163,11 +163,11 @@ describe('Incremental Security', function () {
         // should have the correct amount of eth
         currencyDisplay = await driver.waitForSelector({
           css: '.currency-display-component__text',
-          text: '$1,700.00',
+          text: '1',
         });
         balance = await currencyDisplay.getText();
 
-        assert.strictEqual(balance, '$1,700.00');
+        assert.strictEqual(balance, '1');
 
         // The previous currencyDisplay wait already serves as the guard here for the assertElementNotPresent
         await driver.assertElementNotPresent('.backup-notification');

diff --git a/test/e2e/tests/localization.spec.js b/test/e2e/tests/localization.spec.js
@@ -27,7 +27,7 @@ describe('Localization', function () {
         await unlockWallet(driver);
 
         const secondaryBalance = await driver.findElement(
-          '[data-testid="eth-overview__primary-currency"]',
+          '[data-testid="eth-overview__secondary-currency"]',
         );
         const secondaryBalanceText = await secondaryBalance.getText();
         const [fiatAmount, fiatUnit] = secondaryBalanceText

diff --git a/test/e2e/tests/lock-account.spec.js b/test/e2e/tests/lock-account.spec.js
@@ -30,7 +30,7 @@ describe('Lock and unlock', function () {
         const walletBalance = await driver.findElement(
           '.eth-overview__primary-balance',
         );
-        assert.equal(await walletBalance.getText(), '$42,500.00\nUSD');
+        assert.equal(/^25\s*ETH$/u.test(await walletBalance.getText()), true);
       },
     );
   });

diff --git a/test/e2e/tests/metamask-responsive-ui.spec.js b/test/e2e/tests/metamask-responsive-ui.spec.js
@@ -72,10 +72,10 @@ describe('MetaMask Responsive UI', function () {
         await driver.clickElement('[data-testid="pin-extension-done"]');
         await driver.assertElementNotPresent('.loading-overlay__spinner');
         // assert balance
-        await driver.findElement({
-          css: '[data-testid="eth-overview__primary-currency"]',
-          text: `$ 0.00 USD`,
-        });
+        const balance = await driver.findElement(
+          '[data-testid="eth-overview__primary-currency"]',
+        );
+        assert.ok(/^0\sETH$/u.test(await balance.getText()));
       },
     );
   });

diff --git a/test/e2e/tests/metrics/swaps.spec.js b/test/e2e/tests/metrics/swaps.spec.js
@@ -439,12 +439,10 @@ async function assertSwapCompletedEvents(reqs) {
   const assertionsReq13 = [
     (req) => req.event === MetaMetricsEventName.SwapCompleted,
     (req) => Object.keys(req.properties).length === 30,
-
     (req) => req.properties?.category === MetaMetricsEventCategory.Swaps,
     (req) => req.properties?.chain_id === toHex(1337),
     (req) => req.properties?.environment_type === 'background',
     (req) => req.properties?.locale === 'en',
-
     (req) => req.properties?.token_from === 'TESTETH',
     (req) => req.properties?.token_from_amount === '2',
     (req) => req.properties?.token_to === 'DAI',
@@ -477,7 +475,6 @@ async function assertSwapCompletedEvents(reqs) {
   const assertionsReq14 = [
     (req) => req.event === MetaMetricsEventName.SwapCompleted,
     (req) => Object.keys(req.properties).length === 4,
-
     (req) => req.properties?.category === MetaMetricsEventCategory.Swaps,
     (req) => req.properties?.chain_id === toHex(1337),
     (req) => req.properties?.environment_type === 'background',

diff --git a/test/e2e/tests/migrate-old-vault.spec.js b/test/e2e/tests/migrate-old-vault.spec.js
@@ -32,7 +32,7 @@ describe('Migrate vault with old encryption', function () {
         const walletBalance = await driver.findElement(
           '.eth-overview__primary-balance',
         );
-        assert.equal(await walletBalance.getText(), '$42,500.00\nUSD');
+        assert.equal(/^25\s*ETH$/u.test(await walletBalance.getText()), true);
       },
     );
   });

diff --git a/test/e2e/tests/settings/account-token-list.spec.js b/test/e2e/tests/settings/account-token-list.spec.js
@@ -64,7 +64,7 @@ describe('Settings', function () {
         const tokenListAmount = await driver.findElement(
           '.eth-overview__primary-container',
         );
-        assert.equal(await tokenListAmount.getText(), '$42,500.00\nUSD');
+        assert.equal(await tokenListAmount.getText(), '25\nETH');
         await driver.clickElement('[data-testid="account-menu-icon"]');
         const accountTokenValue = await driver.waitForSelector(
           '.multichain-account-list-item .multichain-account-list-item__asset',

diff --git a/test/e2e/tests/transaction/send-eth.spec.js b/test/e2e/tests/transaction/send-eth.spec.js
@@ -187,10 +187,10 @@ describe('Send ETH', function () {
           await driver.clickElement({ text: 'Confirm', tag: 'button' });
 
           // Go back to home screen to check txn
-          await driver.findElement({
-            css: '[data-testid="eth-overview__primary-currency"]',
-            text: '$42,496.38',
-          });
+          const balance = await driver.findElement(
+            '[data-testid="eth-overview__primary-currency"]',
+          );
+          assert.ok(/^[\d.]+\sETH$/u.test(await balance.getText()));
           await driver.clickElement('[data-testid="home__activity-tab"]');
 
           await driver.findElement(
@@ -219,10 +219,10 @@ describe('Send ETH', function () {
           await unlockWallet(driver);
 
           await driver.assertElementNotPresent('.loading-overlay__spinner');
-          await driver.findElement({
-            css: '[data-testid="eth-overview__primary-currency"]',
-            text: '$42,500.00',
-          });
+          const balance = await driver.findElement(
+            '[data-testid="eth-overview__primary-currency"]',
+          );
+          assert.ok(/^[\d.]+\sETH$/u.test(await balance.getText()));
 
           await openActionMenuAndStartSendFlow(driver);
           // choose to scan via QR code
@@ -435,10 +435,10 @@ describe('Send ETH', function () {
             await unlockWallet(driver);
 
             await driver.assertElementNotPresent('.loading-overlay__spinner');
-            await driver.findElement({
-              css: '[data-testid="eth-overview__primary-currency"]',
-              text: '$42,500.00',
-            });
+            const balance = await driver.findElement(
+              '[data-testid="eth-overview__primary-currency"]',
+            );
+            assert.ok(/^[\d.]+\sETH$/u.test(await balance.getText()));
 
             await openActionMenuAndStartSendFlow(driver);
             await driver.fill(

diff --git a/test/scenarios/18. contract/deploy contract, mint and import NFT with hardware wallet.csv b/test/scenarios/18. contract/deploy contract, mint and import NFT with hardware wallet.csv
@@ -0,0 +1,19 @@
+Steps,Test Steps,Preconditions,Test Data,Expected Result,Notes
+1,Open the extension.,,,The Welcome Back screen is shown.,
+2,Proceed to unlock the wallet.,,password (8 characters min).,"The Ether balance is shown on the overview. The wallet address is shown on the overview.",
+3,"Click on account menu icon. Click ""Add account or hardware wallet"".",,,"The ""Add account"" modal is shown.",
+4,"On ""Add account"" modal, click ""Add hardware wallet"" button.",,,"""Connect a hardware wallet"" screen is shown. User can choose between different options to connect a hardware: Ledger, Trezor, Lattice, or QR-based. ""Continue"" button is disabled.",
+5,Choose an option to connect hardware wallet.,We need to have a hardware wallet set up to test this functionality.,"e.g. choose ""Ledger""","""Continue"" button is enabled.",
+6,"Plug the hardware wallet directly into computer, then unlock it.",,Password for hardware wallet,"Hardware wallet is detected by MetaMask. ""Select an account"" screen is shown on MetaMask, accounts on hardware wallet are shown on this screen.","If you use Ledger, you need to open the Ethereum app on Ledger. If you use Trezor, make sure you use the correct passphrase."
+7,"Choose one or multiples accounts that user wants to connect. Then click ""Unlock"".",,,,
+8,Click account menu icon to open accounts list.,,,"In accounts list, all selected hardware wallet accounts are shown, and they are all flagged with harware wallet name to be distinguished from other accounts.",
+9,Select one hardware wallet account.,,,"The Ether balance for the selected hardware wallet account is shown on the overview. The selected account address is shown on the overview.",
+10,Open the test dapp in another tab.,,https://metamask.github.io/test-dapp/,,
+11,Click Connect.,,,"The MetaMask popup is opened with the Connect with MetaMask screen displayed. Your imported hardware wallet account is selected.",
+12,Click Next and Connect with the hardware wallet account.,,,"The MetaMask popup is closed. You are connected to the test dapp.",
+13,"Click Deploy in the ""NFTs"" section",,,"The info modal instructions for deploying a contract with hardware wallet is displayed. The HEX tab displays the hex data for the transaction.",
+14,"Click Confirm in the displayed modal. Then Review and Confirm the Transaction in the hardware wallet device.",,,"The MINT button enabled in the test dapp and the NFTs status is deployed",
+15,"Click MINT in the test dapp.",,,"The info modal instructions for minting with hardware wallet is displayed. The HEX tab displays the hex data for the transaction.",
+16,"Click Confirm in the displayed modal. Then Review and Confirm the Transaction in the hardware wallet device.",,,"All the other buttons in the NFTs section are now enabled. The NFTs status is Mint completed",
+17,"Click ""WATCH NFT"" in the test dapp.",,,"The info modal instructions for importing NFT is displayed.",
+18,"Click ""Add NFT"" in the displayed modal.",,,"The NFT is imported into the wallet. The NFT is shown in the NFTs tab.",
diff --git a/test/scenarios/18. contract/send token with hardware wallet.csv b/test/scenarios/18. contract/send token with hardware wallet.csv
@@ -0,0 +1,17 @@
+Steps,Test Steps,Preconditions,Test Data,Expected Result,Notes
+1,Open the extension.,,,The Welcome Back screen is shown.,
+2,Proceed to unlock the wallet.,,password (8 characters min).,"The Ether balance is shown on the overview. The wallet address is shown on the overview.",
+3,"Click on account menu icon. Click ""Add account or hardware wallet"".",,,"The ""Add account"" modal is shown.",
+4,"On ""Add account"" modal, click ""Add hardware wallet"" button.",,,"""Connect a hardware wallet"" screen is shown. User can choose between different options to connect a hardware: Ledger, Trezor, Lattice, or QR-based. ""Continue"" button is disabled.",
+5,Choose an option to connect hardware wallet.,We need to have a hardware wallet set up to test this functionality.,"e.g. choose ""Ledger""","""Continue"" button is enabled.",
+6,"Plug the hardware wallet directly into computer, then unlock it.",,Password for hardware wallet,"Hardware wallet is detected by MetaMask. ""Select an account"" screen is shown on MetaMask, accounts on hardware wallet are shown on this screen.","If you use Ledger, you need to open the Ethereum app on Ledger. If you use Trezor, make sure you use the correct passphrase."
+7,"Choose one or multiples accounts that user wants to connect. Then click ""Unlock"".",,,,
+8,Click account menu icon to open accounts list.,,,"In accounts list, all selected hardware wallet accounts are shown, and they are all flagged with harware wallet name to be distinguished from other accounts.",
+9,Select one hardware wallet account.,,,"The Ether balance for the selected hardware wallet account is shown on the overview. The selected account address is shown on the overview.",
+10,Open the test dapp in another tab.,,https://metamask.github.io/test-dapp/,,
+11,Click Connect.,,,"The MetaMask popup is opened with the Connect with MetaMask screen displayed. Your imported hardware wallet account is selected.",
+12,Click Next and Connect with the hardware wallet account.,,,"The MetaMask popup is closed. You are connected to the test dapp.",
+13,"Click ""Create Token"" in the ""Send Tokens"" section",,,"The info modal instructions for creating a token with hardware wallet is displayed. The HEX tab displays the hex data for the transaction.",
+14,"Click Confirm in the displayed modal. Then Review and Confirm the Transaction in the hardware wallet device.",,,"All the other buttons in the ""Create Token"" section are now enabled. The created Token Address is displayed",
+15, "Click ""Transfer Token"" button in the ""Send Tokens"" section",,,"The info modal instructions for sending a token with hardware wallet is displayed. The HEX tab displays the hex data for the transaction.",
+16,"Click Confirm in the displayed modal. Then Review and Confirm the Transaction in the hardware wallet device.",,,"Check the Activity Tab in MetaMask to see the approved send transaction",
diff --git a/ui/components/app/confirm/info/__snapshots__/info.test.tsx.snap b/ui/components/app/confirm/info/__snapshots__/info.test.tsx.snap
@@ -22,63 +22,57 @@ exports[`ConfirmInfo should match snapshot 1`] = `
         class="mm-box mm-box--display-flex mm-box--flex-direction-row mm-box--align-items-center"
       >
         <div
-          class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-account mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-transparent box--border-style-solid box--border-width-1"
+          class="mm-box mm-box--display-flex mm-box--flex-direction-row mm-box--align-items-center"
         >
           <div
-            class="mm-avatar-account__jazzicon"
+            class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-account mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-transparent box--border-style-solid box--border-width-1"
           >
             <div
-              style="border-radius: 50px; overflow: hidden; padding: 0px; margin: 0px; width: 16px; height: 16px; display: inline-block; background: rgb(1, 142, 116);"
+              class="mm-avatar-account__jazzicon"
             >
-              <svg
-                height="16"
-                width="16"
-                x="0"
-                y="0"
+              <div
+                style="border-radius: 50px; overflow: hidden; padding: 0px; margin: 0px; width: 16px; height: 16px; display: inline-block; background: rgb(1, 142, 116);"
               >
-                <rect
-                  fill="#FB1891"
+                <svg
                   height="16"
-                  transform="translate(0.6335263099240563 1.7352552986765108) rotate(129.9 8 8)"
                   width="16"
                   x="0"
                   y="0"
-                />
-                <rect
-                  fill="#F90901"
-                  height="16"
-                  transform="translate(-5.227286615169763 8.640359200885621) rotate(141.5 8 8)"
-                  width="16"
-                  x="0"
-                  y="0"
-                />
-                <rect
-                  fill="#F26A02"
-                  height="16"
-                  transform="translate(10.585940898259892 -4.814122444807073) rotate(339.2 8 8)"
-                  width="16"
-                  x="0"
-                  y="0"
-                />
-              </svg>
+                >
+                  <rect
+                    fill="#FB1891"
+                    height="16"
+                    transform="translate(0.6335263099240563 1.7352552986765108) rotate(129.9 8 8)"
+                    width="16"
+                    x="0"
+                    y="0"
+                  />
+                  <rect
+                    fill="#F90901"
+                    height="16"
+                    transform="translate(-5.227286615169763 8.640359200885621) rotate(141.5 8 8)"
+                    width="16"
+                    x="0"
+                    y="0"
+                  />
+                  <rect
+                    fill="#F26A02"
+                    height="16"
+                    transform="translate(10.585940898259892 -4.814122444807073) rotate(339.2 8 8)"
+                    width="16"
+                    x="0"
+                    y="0"
+                  />
+                </svg>
+              </div>
             </div>
           </div>
-        </div>
-        <div>
-          <div
-            aria-describedby="tippy-tooltip-1"
-            class=""
-            data-original-title="0xCcCCccccCCCCcCCCCCCcCcCccCcCCCcCcccccccC"
-            data-tooltipped=""
-            style="display: inline;"
-            tabindex="0"
+          <p
+            class="mm-box mm-text mm-text--body-md mm-box--margin-left-2 mm-box--color-inherit"
+            data-testid="confirm-info-row-display-name"
           >
-            <p
-              class="mm-box mm-text mm-text--body-md mm-box--margin-left-2 mm-box--color-inherit"
-            >
-              0xCcCCc...ccccC
-            </p>
-          </div>
+            0xCcCCc...ccccC
+          </p>
         </div>
       </div>
     </div>