@metamask/controllers@15.0.0 (#11975)

Adds the latest version of `@metamask/controllers`, and updates our usage of the `ApprovalController`, which has been migrated to `BaseControllerV2`. Of [the new `controllers` release](https://github.com/MetaMask/controllers/releases/tag/v15.0.0), only the `ApprovalController` migration should be breaking.

This is the first time we use events on the `ControllerMessenger` to update the badge, so I turned the messenger into a property on the main `MetaMaskController` in order to subscribe to events on it in `background.js`. I confirmed that the badge does indeed update during local QA.

As it turns out, [MetaMask/controllers#571](https://github.com/MetaMask/controllers/pull/571) was breaking for a single unit test case, which is now handled during setup and teardown for the related test suite (`metamask-controller.test.js`).

app/scripts/background.js

@@ -435,12 +435,16 @@ function setupController(initState, initLangCode) {
     METAMASK_CONTROLLER_EVENTS.UPDATE_BADGE,
     updateBadge,
   );
-  controller.approvalController.subscribe(updateBadge);
   controller.appStateController.on(
     METAMASK_CONTROLLER_EVENTS.UPDATE_BADGE,
     updateBadge,
   );
 
+  controller.controllerMessenger.subscribe(
+    METAMASK_CONTROLLER_EVENTS.APPROVAL_STATE_CHANGE,
+    updateBadge,
+  );
+
   /**
    * Updates the Web Extension's "badge" number, on the little fox in the toolbar.
    * The number reflects the current number of pending transactions or message signatures needing user approval.

app/scripts/controllers/permissions/index.js

@@ -249,7 +249,7 @@ export class PermissionsController {
           approved.permissions,
           accounts,
         );
-        this.approvals.resolve(id, approved.permissions);
+        this.approvals.accept(id, approved.permissions);
       }
     } catch (err) {
       // if finalization fails, reject the request

app/scripts/metamask-controller.js

@@ -75,6 +75,8 @@ export const METAMASK_CONTROLLER_EVENTS = {
   // Fired after state changes that impact the extension badge (unapproved msg count)
   // The process of updating the badge happens in app/scripts/background.js.
   UPDATE_BADGE: 'updateBadge',
+  // TODO: Add this and similar enums to @metamask/controllers and export them
+  APPROVAL_STATE_CHANGE: 'ApprovalController:stateChange',
 };
 
 /**
@@ -115,12 +117,12 @@ export default class MetamaskController extends EventEmitter {
     this.getRequestAccountTabIds = opts.getRequestAccountTabIds;
     this.getOpenMetamaskTabsIds = opts.getOpenMetamaskTabsIds;
 
-    const controllerMessenger = new ControllerMessenger();
+    this.controllerMessenger = new ControllerMessenger();
 
     // observable state store
     this.store = new ComposableObservableStore({
       state: initState,
-      controllerMessenger,
+      controllerMessenger: this.controllerMessenger,
     });
 
     // external connections by origin
@@ -140,6 +142,9 @@ export default class MetamaskController extends EventEmitter {
     // controller initialization order matters
 
     this.approvalController = new ApprovalController({
+      messenger: this.controllerMessenger.getRestricted({
+        name: 'ApprovalController',
+      }),
       showApprovalRequest: opts.showUserConfirmation,
     });
 
@@ -178,7 +183,7 @@ export default class MetamaskController extends EventEmitter {
       initState: initState.MetaMetricsController,
     });
 
-    const gasFeeMessenger = controllerMessenger.getRestricted({
+    const gasFeeMessenger = this.controllerMessenger.getRestricted({
       name: 'GasFeeController',
     });
 
@@ -219,7 +224,7 @@ export default class MetamaskController extends EventEmitter {
       preferencesStore: this.preferencesController.store,
     });
 
-    const currencyRateMessenger = controllerMessenger.getRestricted({
+    const currencyRateMessenger = this.controllerMessenger.getRestricted({
       name: 'CurrencyRateController',
     });
     this.currencyRateController = new CurrencyRateController({
@@ -228,7 +233,7 @@ export default class MetamaskController extends EventEmitter {
       state: initState.CurrencyController,
     });
 
-    const tokenListMessenger = controllerMessenger.getRestricted({
+    const tokenListMessenger = this.controllerMessenger.getRestricted({
       name: 'TokenListController',
     });
     this.tokenListController = new TokenListController({
@@ -578,7 +583,7 @@ export default class MetamaskController extends EventEmitter {
         GasFeeController: this.gasFeeController,
         TokenListController: this.tokenListController,
       },
-      controllerMessenger,
+      controllerMessenger: this.controllerMessenger,
     });
     this.memStore.subscribe(this.sendUpdate.bind(this));
 
@@ -1106,7 +1111,7 @@ export default class MetamaskController extends EventEmitter {
 
       // approval controller
       resolvePendingApproval: nodeify(
-        approvalController.resolve,
+        approvalController.accept,
         approvalController,
       ),
       rejectPendingApproval: nodeify(

app/scripts/metamask-controller.test.js

@@ -109,6 +109,7 @@ describe('MetaMaskController', function () {
   const noop = () => undefined;
 
   before(async function () {
+    globalThis.AbortController = window.AbortController;
     await ganacheServer.start();
   });
 
@@ -157,6 +158,7 @@ describe('MetaMaskController', function () {
 
   after(async function () {
     await ganacheServer.quit();
+    delete globalThis.AbortController;
   });
 
   describe('#getAccounts', function () {

package.json

@@ -104,7 +104,7 @@
     "@fortawesome/fontawesome-free": "^5.13.0",
     "@material-ui/core": "^4.11.0",
     "@metamask/contract-metadata": "^1.28.0",
-    "@metamask/controllers": "^14.0.2",
+    "@metamask/controllers": "^15.0.0",
     "@metamask/eth-ledger-bridge-keyring": "^0.6.0",
     "@metamask/eth-token-tracker": "^3.0.1",
     "@metamask/etherscan-link": "^2.1.0",

test/mocks/permission-controller.js

@@ -1,7 +1,7 @@
 import { ethErrors, errorCodes } from 'eth-rpc-errors';
 import deepFreeze from 'deep-freeze-strict';
 
-import { ApprovalController } from '@metamask/controllers';
+import { ApprovalController, ControllerMessenger } from '@metamask/controllers';
 
 import _getRestrictedMethods from '../../app/scripts/controllers/permissions/restrictedMethods';
 
@@ -70,6 +70,7 @@ const getRestrictedMethods = (permController) => {
 export function getPermControllerOpts() {
   return {
     approvals: new ApprovalController({
+      messenger: new ControllerMessenger(),
       showApprovalRequest: noop,
     }),
     getKeyringAccounts: async () => [...keyringAccounts],

yarn.lock

@@ -2725,19 +2725,19 @@
     semver "^7.3.5"
     yargs "^17.0.1"
 
-"@metamask/contract-metadata@^1.19.0", "@metamask/contract-metadata@^1.28.0":
+"@metamask/contract-metadata@^1.19.0", "@metamask/contract-metadata@^1.28.0", "@metamask/contract-metadata@^1.29.0":
   version "1.29.0"
   resolved "https://registry.yarnpkg.com/@metamask/contract-metadata/-/contract-metadata-1.29.0.tgz#4ca86a2f03d4dad4350d09216a7fe92f9dd21c8e"
   integrity sha512-wxsC0ZCyhPKqThvmsL8+2zVWGWPqofSo8HNtOuOnQM9oGbXX9294imJ3T+A/Lov8fkX4jAWZOeNV0uR80zkNtA==
 
-"@metamask/controllers@^14.0.2":
+"@metamask/controllers@^15.0.0":
-  version "14.2.0"
+  version "15.0.0"
-  resolved "https://registry.yarnpkg.com/@metamask/controllers/-/controllers-14.2.0.tgz#bed161ac3523fd525be79b0e557b132e2e2526e4"
+  resolved "https://registry.yarnpkg.com/@metamask/controllers/-/controllers-15.0.0.tgz#b7e816e12e02debaf32f7bab5f8d612cbd7a5170"
-  integrity sha512-1Is1OJByDJo5GOKt02TiCCGhYlclcAT2IeoiqhSL6fTUT4Qc+2xwgjx42XeE7bzKIDwXpxafpHViCkO3d6IIdA==
+  integrity sha512-vYVwDVctxdmBRBYDzPfpab3GoVtePykaMKfOdgD+OT8Cz8tlDrEIRc5+DZhr6HembWg8LkNfw9Gh5lKfAFSGLg==
   dependencies:
     "@ethereumjs/common" "^2.3.1"
     "@ethereumjs/tx" "^3.2.1"
-    "@metamask/contract-metadata" "^1.28.0"
+    "@metamask/contract-metadata" "^1.29.0"
     "@types/uuid" "^8.3.0"
     async-mutex "^0.2.6"
     babel-runtime "^6.26.0"