From 993d2eb5c922082a5e76b39e4d68efeb2e638ee6 Mon Sep 17 00:00:00 2001
From: Alberto Nicolas Penayo <74352651+bee344@users.noreply.github.com>
Date: Tue, 30 Jul 2024 18:00:40 -0300
Subject: [PATCH] fix(bug): extension stuck in `... loading ...` screen after
 `service_worker` got terminated (#1424)

* add background wakeup

* add background wakeup
---
 packages/extension-ui/src/messaging.ts | 32 +++++++++++++++++++++++++-
 packages/extension/src/background.ts   |  6 +++++
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/packages/extension-ui/src/messaging.ts b/packages/extension-ui/src/messaging.ts
index c3df1089..5ede74b3 100644
--- a/packages/extension-ui/src/messaging.ts
+++ b/packages/extension-ui/src/messaging.ts
@@ -30,7 +30,37 @@ interface Handler {
 
 type Handlers = Record<string, Handler>;
 
-const port = chrome.runtime.connect({ name: PORT_EXTENSION });
+async function wakeupBackground (): Promise<Error | null> {
+  try {
+    await chrome.runtime.sendMessage({ type: 'wakeup' });
+
+    return null;
+  } catch (cause) {
+    return cause instanceof Error ? cause : new Error(String(cause));
+  }
+}
+
+async function createPort (name: string, maxAttempts: number, delayMs: number): Promise<chrome.runtime.Port> {
+  let lastError: Error | null = null;
+
+  for (let attempt = 0; attempt < maxAttempts; attempt++) {
+    const error = await wakeupBackground();
+
+    if (error) {
+      lastError = error;
+      await new Promise((resolve) => setTimeout(resolve, delayMs));
+      continue;
+    }
+
+    const port = chrome.runtime.connect({ name });
+
+    return port;
+  }
+
+  throw new Error('Failed to create port after multiple attempts', { cause: lastError });
+}
+
+const port = await createPort(PORT_EXTENSION, 5, 1000);
 const handlers: Handlers = {};
 
 // setup a listener for messages, any incoming resolves the promise
diff --git a/packages/extension/src/background.ts b/packages/extension/src/background.ts
index 962afcda..665d6280 100644
--- a/packages/extension/src/background.ts
+++ b/packages/extension/src/background.ts
@@ -50,6 +50,12 @@ function getActiveTabs () {
   });
 }
 
+chrome.runtime.onMessage.addListener((message: { type: string }, _, sendResponse) => {
+  if (message.type === 'wakeup') {
+    sendResponse({ status: 'awake' });
+  }
+});
+
 // listen to tab updates this is fired on url change
 chrome.tabs.onUpdated.addListener((_, changeInfo) => {
   // we are only interested in url change