Merge branch 'develop' into update-spending-cap

.circleci/scripts/firefox-install.sh

@@ -4,7 +4,7 @@ set -e
 set -u
 set -o pipefail
 
-FIREFOX_VERSION='106.0.4'
+FIREFOX_VERSION='110.0'
 FIREFOX_BINARY="firefox-${FIREFOX_VERSION}.tar.bz2"
 FIREFOX_BINARY_URL="https://ftp.mozilla.org/pub/firefox/releases/${FIREFOX_VERSION}/linux-x86_64/en-US/${FIREFOX_BINARY}"
 FIREFOX_PATH='/opt/firefox'

app/scripts/background.js

@@ -54,6 +54,16 @@ import setupEnsIpfsResolver from './lib/ens-ipfs/setup';
 import { deferredPromise, getPlatform } from './lib/util';
 /* eslint-enable import/first */
 
+/* eslint-disable import/order */
+///: BEGIN:ONLY_INCLUDE_IN(desktop)
+import {
+  CONNECTION_TYPE_EXTERNAL,
+  CONNECTION_TYPE_INTERNAL,
+} from '@metamask/desktop/dist/constants';
+import DesktopManager from '@metamask/desktop/dist/desktop-manager';
+///: END:ONLY_INCLUDE_IN
+/* eslint-enable import/order */
+
 const { sentry } = global;
 const firstTimeState = { ...rawFirstTimeState };
 
@@ -97,6 +107,13 @@ const PHISHING_WARNING_PAGE_TIMEOUT = ONE_SECOND_IN_MILLISECONDS;
 const ACK_KEEP_ALIVE_MESSAGE = 'ACK_KEEP_ALIVE_MESSAGE';
 const WORKER_KEEP_ALIVE_MESSAGE = 'WORKER_KEEP_ALIVE_MESSAGE';
 
+///: BEGIN:ONLY_INCLUDE_IN(desktop)
+const OVERRIDE_ORIGIN = {
+  EXTENSION: 'EXTENSION',
+  DESKTOP: 'DESKTOP_APP',
+};
+///: END:ONLY_INCLUDE_IN
+
 // Event emitter for state persistence
 export const statePersistenceEvents = new EventEmitter();
 
@@ -245,6 +262,11 @@ async function initialize() {
   try {
     const initState = await loadStateFromPersistence();
     const initLangCode = await getFirstPreferredLangCode();
+
+    ///: BEGIN:ONLY_INCLUDE_IN(desktop)
+    await DesktopManager.init(platform.getVersion());
+    ///: END:ONLY_INCLUDE_IN
+
     setupController(initState, initLangCode);
     if (!isManifestV3) {
       await loadPhishingWarningPage();
@@ -482,6 +504,26 @@ export function setupController(initState, initLangCode, overrides) {
    * @param {Port} remotePort - The port provided by a new context.
    */
   connectRemote = async (remotePort) => {
+    ///: BEGIN:ONLY_INCLUDE_IN(desktop)
+    if (
+      DesktopManager.isDesktopEnabled() &&
+      OVERRIDE_ORIGIN.DESKTOP !== overrides?.getOrigin?.()
+    ) {
+      DesktopManager.createStream(remotePort, CONNECTION_TYPE_INTERNAL).then(
+        () => {
+          // When in Desktop Mode the responsibility to send CONNECTION_READY is on the desktop app side
+          if (isManifestV3) {
+            // Message below if captured by UI code in app/scripts/ui.js which will trigger UI initialisation
+            // This ensures that UI is initialised only after background is ready
+            // It fixes the issue of blank screen coming when extension is loaded, the issue is very frequent in MV3
+            remotePort.postMessage({ name: 'CONNECTION_READY' });
+          }
+        },
+      );
+      return;
+    }
+    ///: END:ONLY_INCLUDE_IN
+
     const processName = remotePort.name;
 
     if (metamaskBlockedPorts.includes(remotePort.name)) {
@@ -584,6 +626,16 @@ export function setupController(initState, initLangCode, overrides) {
 
   // communication with page or other extension
   connectExternal = (remotePort) => {
+    ///: BEGIN:ONLY_INCLUDE_IN(desktop)
+    if (
+      DesktopManager.isDesktopEnabled() &&
+      OVERRIDE_ORIGIN.DESKTOP !== overrides?.getOrigin?.()
+    ) {
+      DesktopManager.createStream(remotePort, CONNECTION_TYPE_EXTERNAL);
+      return;
+    }
+    ///: END:ONLY_INCLUDE_IN
+
     const portStream =
       overrides?.getPortStream?.(remotePort) || new PortStream(remotePort);
     controller.setupUntrustedCommunication({
@@ -762,6 +814,14 @@ export function setupController(initState, initLangCode, overrides) {
 
     updateBadge();
   }
+
+  ///: BEGIN:ONLY_INCLUDE_IN(desktop)
+  if (OVERRIDE_ORIGIN.DESKTOP !== overrides?.getOrigin?.()) {
+    controller.store.subscribe((state) => {
+      DesktopManager.setState(state);
+    });
+  }
+  ///: END:ONLY_INCLUDE_IN
 }
 
 //

app/scripts/lib/rpc-method-middleware/handlers/desktop/enable-desktop.js

@@ -0,0 +1,43 @@
+import { MESSAGE_TYPE } from '../../../../../../shared/constants/app';
+
+/**
+ * A wrapper for `eth_accounts` that returns an empty array when permission is denied.
+ */
+
+const requestEthereumAccounts = {
+  methodNames: [MESSAGE_TYPE.ENABLE_DESKTOP],
+  implementation: enableDesktop,
+  hookNames: {
+    testDesktopConnection: true,
+    generateOtp: true,
+  },
+};
+export default requestEthereumAccounts;
+
+/**
+ * @typedef {Record<string, Function>} EthAccountsOptions
+ * @property {Function} getAccounts - Gets the accounts for the requesting
+ * origin.
+ */
+
+/**
+ *
+ * @param {import('json-rpc-engine').JsonRpcRequest<unknown>} _req - The JSON-RPC request object.
+ * @param {import('json-rpc-engine').JsonRpcResponse<true>} res - The JSON-RPC response object.
+ * @param {Function} _next - The json-rpc-engine 'next' callback.
+ * @param {Function} end - The json-rpc-engine 'end' callback.
+ * @param {EthAccountsOptions} options - The RPC method hooks.
+ */
+async function enableDesktop(
+  _req,
+  res,
+  _next,
+  end,
+  { testDesktopConnection, generateOtp },
+) {
+  const testResult = await testDesktopConnection();
+  const otp = testResult.isConnected ? await generateOtp() : undefined;
+
+  res.result = { ...testResult, otp };
+  return end();
+}

app/scripts/lib/rpc-method-middleware/handlers/index.js

@@ -7,6 +7,10 @@ import sendMetadata from './send-metadata';
 import switchEthereumChain from './switch-ethereum-chain';
 import watchAsset from './watch-asset';
 
+///: BEGIN:ONLY_INCLUDE_IN(desktop)
+import enableDesktop from './desktop/enable-desktop';
+///: END:ONLY_INCLUDE_IN
+
 const handlers = [
   addEthereumChain,
   ethAccounts,
@@ -16,5 +20,8 @@ const handlers = [
   sendMetadata,
   switchEthereumChain,
   watchAsset,
+  ///: BEGIN:ONLY_INCLUDE_IN(desktop)
+  enableDesktop,
+  ///: END:ONLY_INCLUDE_IN
 ];
 export default handlers;

app/scripts/lib/setupSentry.js

@@ -41,6 +41,7 @@ export const SENTRY_STATE = {
     currentLocale: true,
     customNonceValue: true,
     defaultHomeActiveTabName: true,
+    desktopEnabled: true,
     featureFlags: true,
     firstTimeFlowType: true,
     forgottenPassword: true,
@@ -140,23 +141,7 @@ export default function setupSentry({ release, getState }) {
     ],
     release,
     beforeSend: (report) => rewriteReport(report, getState),
-    beforeBreadcrumb(breadcrumb) {
-      if (getState) {
-        const appState = getState();
-        if (
-          Object.values(appState).length &&
-          (!appState?.store?.metamask?.participateInMetaMetrics ||
-            !appState?.store?.metamask?.completedOnboarding ||
-            breadcrumb?.category === 'ui.input')
-        ) {
-          return null;
-        }
-      } else {
-        return null;
-      }
-      const newBreadcrumb = removeUrlsFromBreadCrumb(breadcrumb);
-      return newBreadcrumb;
-    },
+    beforeBreadcrumb: beforeBreadcrumb(getState),
   });
 
   return Sentry;
@@ -178,6 +163,32 @@ function hideUrlIfNotInternal(url) {
   return url;
 }
 
+/**
+ * Returns a method that handles the Sentry breadcrumb using a specific method to get the extension state
+ *
+ * @param {Function} getState - A method that returns the state of the extension
+ * @returns {(breadcrumb: object) => object} A method that modifies a Sentry breadcrumb object
+ */
+export function beforeBreadcrumb(getState) {
+  return (breadcrumb) => {
+    if (getState) {
+      const appState = getState();
+      if (
+        Object.values(appState).length &&
+        (!appState?.store?.metamask?.participateInMetaMetrics ||
+          !appState?.store?.metamask?.completedOnboarding ||
+          breadcrumb?.category === 'ui.input')
+      ) {
+        return null;
+      }
+    } else {
+      return null;
+    }
+    const newBreadcrumb = removeUrlsFromBreadCrumb(breadcrumb);
+    return newBreadcrumb;
+  };
+}
+
 /**
  * Receives a Sentry breadcrumb object and potentially removes urls
  * from its `data` property, it particular those possibly found at
@@ -315,8 +326,11 @@ function rewriteErrorMessages(report, rewriteFn) {
 }
 
 function rewriteReportUrls(report) {
-  // update request url
-  report.request.url = toMetamaskUrl(report.request.url);
+  if (report.request?.url) {
+    // update request url
+    report.request.url = toMetamaskUrl(report.request.url);
+  }
+
   // update exception stack trace
   if (report.exception && report.exception.values) {
     report.exception.values.forEach((item) => {
@@ -330,6 +344,10 @@ function rewriteReportUrls(report) {
 }
 
 function toMetamaskUrl(origUrl) {
+  if (!globalThis.location?.origin) {
+    return origUrl;
+  }
+
   const filePath = origUrl?.split(globalThis.location.origin)[1];
   if (!filePath) {
     return origUrl;