MV3: Update service worker restart logic and keep-alive logic for dapp support

app/scripts/background.js

@@ -1,3 +1,5 @@
+/* global chrome */
+
 /**
  * @file The entry point for the web extension singleton process.
  */
@@ -102,6 +104,15 @@ const initApp = async (remotePort) => {
 
 if (isManifestV3) {
   browser.runtime.onConnect.addListener(initApp);
+  // Message below signals content script in DAPPS to connect to metamask background as backend is not active
+  // It is required to re-connect DAPPS after service worker re-activation
+  chrome.tabs.query({ active: true, currentWindow: true }, function (tabs) {
+    chrome.tabs.sendMessage(
+      tabs[0].id,
+      { name: 'METAMASK_EXTENSION_READY' },
+      () => undefined,
+    );
+  });
 } else {
   // initialization flow
   initialize().catch(log.error);

app/scripts/contentscript.js

@@ -5,6 +5,7 @@ import browser from 'webextension-polyfill';
 import PortStream from 'extension-port-stream';
 import { obj as createThoughStream } from 'through2';
 
+import { MESSAGE_TYPE } from '../../shared/constants/app';
 import { isManifestV3 } from '../../shared/modules/mv3.utils';
 import shouldInjectProvider from '../../shared/modules/provider-injection';
 
@@ -44,9 +45,6 @@ let legacyExtMux,
   legacyPagePublicConfigChannel,
   notificationTransformStream;
 
-const WORKER_KEEP_ALIVE_INTERVAL = 1000;
-const WORKER_KEEP_ALIVE_MESSAGE = 'WORKER_KEEP_ALIVE_MESSAGE';
-
 const phishingPageUrl = new URL(process.env.PHISHING_WARNING_PAGE_URL);
 
 let phishingExtChannel,
@@ -82,6 +80,52 @@ function injectScript(content) {
   }
 }
 
+/**
+ * SERVICE WORKER LOGIC
+ */
+
+const WORKER_KEEP_ALIVE_INTERVAL = 1000;
+const WORKER_KEEP_ALIVE_MESSAGE = 'WORKER_KEEP_ALIVE_MESSAGE';
+const TIME_45_MIN_IN_MS = 45 * 60 * 1000;
+
+/**
+ * Don't run the keep worker alive logic for initial JSON RPC methods.
+ * We should not run keep-alive logic for non-dapp pages.
+ */
+const IGNORE_INIT_METHODS_FOR_KEEP_ALIVE = [
+  MESSAGE_TYPE.GET_PROVIDER_STATE,
+  MESSAGE_TYPE.SEND_METADATA,
+];
+
+let keepAliveInterval;
+let keepAliveTimer;
+
+/**
+ * Running this method will ensure the service worker is kept alive for 45 minutes
+ * First message is sent immediately, subsequent messages are sent at interval of WORKER_KEEP_ALIVE_INTERVAL
+ */
+const runWorkerKeepAliveInterval = () => {
+  if (keepAliveTimer) {
+    clearTimeout(keepAliveTimer);
+  }
+
+  keepAliveTimer = setTimeout(() => {
+    clearInterval(keepAliveInterval);
+  }, TIME_45_MIN_IN_MS);
+
+  if (keepAliveInterval) {
+    clearInterval(keepAliveInterval);
+  }
+
+  browser.runtime.sendMessage({ name: WORKER_KEEP_ALIVE_MESSAGE });
+
+  keepAliveInterval = setInterval(() => {
+    if (browser.runtime.id) {
+      browser.runtime.sendMessage({ name: WORKER_KEEP_ALIVE_MESSAGE });
+    }
+  }, WORKER_KEEP_ALIVE_INTERVAL);
+};
+
 /**
  * PHISHING STREAM LOGIC
  */
@@ -93,6 +137,14 @@ function setupPhishingPageStreams() {
     target: PHISHING_WARNING_PAGE,
   });
 
+  if (isManifestV3) {
+    phishingPageStream.on('data', ({ data: { method } }) => {
+      if (!IGNORE_INIT_METHODS_FOR_KEEP_ALIVE.includes(method)) {
+        runWorkerKeepAliveInterval();
+      }
+    });
+  }
+
   // create and connect channel muxers
   // so we can handle the channels individually
   phishingPageMux = new ObjectMultiplex();
@@ -142,6 +194,9 @@ const setupPhishingExtStreams = () => {
       error,
     ),
   );
+
+  // eslint-disable-next-line no-use-before-define
+  phishingExtPort.onDisconnect.addListener(resetPhishingStreamAndListeners);
 };
 
 /** Destroys all of the phishing extension streams */
@@ -164,8 +219,6 @@ const resetPhishingStreamAndListeners = () => {
 
   destroyPhishingExtStreams();
   setupPhishingExtStreams();
-
-  phishingExtPort.onDisconnect.addListener(resetPhishingStreamAndListeners);
 };
 
 /**
@@ -176,8 +229,6 @@ const resetPhishingStreamAndListeners = () => {
 const initPhishingStreams = () => {
   setupPhishingPageStreams();
   setupPhishingExtStreams();
-
-  phishingExtPort.onDisconnect.addListener(resetPhishingStreamAndListeners);
 };
 
 /**
@@ -191,6 +242,14 @@ const setupPageStreams = () => {
     target: INPAGE,
   });
 
+  if (isManifestV3) {
+    pageStream.on('data', ({ data: { method } }) => {
+      if (!IGNORE_INIT_METHODS_FOR_KEEP_ALIVE.includes(method)) {
+        runWorkerKeepAliveInterval();
+      }
+    });
+  }
+
   // create and connect channel muxers
   // so we can handle the channels individually
   pageMux = new ObjectMultiplex();
@@ -231,6 +290,8 @@ const setupExtensionStreams = () => {
   extensionPhishingStream = extensionMux.createStream('phishing');
   extensionPhishingStream.once('data', redirectToPhishingWarning);
 
+  // eslint-disable-next-line no-use-before-define
+  extensionPort.onDisconnect.addListener(resetStreamAndListeners);
   notifyInpageOfExtensionStreamConnect();
 };
 
@@ -247,6 +308,7 @@ const destroyExtensionStreams = () => {
 
 /**
  * LEGACY STREAM LOGIC
+ * TODO:LegacyProvider: Delete
  */
 
 // TODO:LegacyProvider: Delete
@@ -256,6 +318,14 @@ const setupLegacyPageStreams = () => {
     target: LEGACY_INPAGE,
   });
 
+  if (isManifestV3) {
+    legacyPageStream.on('data', ({ data: { method } }) => {
+      if (!IGNORE_INIT_METHODS_FOR_KEEP_ALIVE.includes(method)) {
+        runWorkerKeepAliveInterval();
+      }
+    });
+  }
+
   legacyPageMux = new ObjectMultiplex();
   legacyPageMux.setMaxListeners(25);
 
@@ -330,6 +400,16 @@ const destroyLegacyExtensionStreams = () => {
   legacyExtPublicConfigChannel.destroy();
 };
 
+// When extension background is loaded it sends message 'METAMASK_EXTENSION_READY' to browser tabs
+// Function below helps to setup streams after service worker in-activity
+const activateStreams = (msg) => {
+  if (msg.name === 'METAMASK_EXTENSION_READY') {
+    setupExtensionStreams();
+    setupLegacyExtensionStreams();
+  }
+};
+browser.runtime.onMessage.addListener(activateStreams);
+
 /**
  * Resets the extension stream with new streams to channel with the in page streams,
  * and creates a new event listener to the reestablished extension port.
@@ -338,12 +418,7 @@ const resetStreamAndListeners = () => {
   extensionPort.onDisconnect.removeListener(resetStreamAndListeners);
 
   destroyExtensionStreams();
-  setupExtensionStreams();
-
   destroyLegacyExtensionStreams();
-  setupLegacyExtensionStreams();
-
-  extensionPort.onDisconnect.addListener(resetStreamAndListeners);
 };
 
 /**
@@ -353,13 +428,10 @@ const resetStreamAndListeners = () => {
  */
 const initStreams = () => {
   setupPageStreams();
-  setupExtensionStreams();
-
-  // TODO:LegacyProvider: Delete
   setupLegacyPageStreams();
-  setupLegacyExtensionStreams();
 
-  extensionPort.onDisconnect.addListener(resetStreamAndListeners);
+  setupExtensionStreams();
+  setupLegacyExtensionStreams();
 };
 
 // TODO:LegacyProvider: Delete
@@ -446,12 +518,6 @@ function redirectToPhishingWarning(data = {}) {
   window.location.href = `${baseUrl}#${querystring}`;
 }
 
-const initKeepWorkerAlive = () => {
-  setInterval(() => {
-    browser.runtime.sendMessage({ name: WORKER_KEEP_ALIVE_MESSAGE });
-  }, WORKER_KEEP_ALIVE_INTERVAL);
-};
-
 const start = () => {
   const isDetectedPhishingSite =
     window.location.origin === phishingPageUrl.origin &&
@@ -463,9 +529,7 @@ const start = () => {
   }
 
   if (shouldInjectProvider()) {
-    if (isManifestV3) {
-      initKeepWorkerAlive();
-    } else {
+    if (!isManifestV3) {
       injectScript(inpageBundle);
     }
     initStreams();