Fix: Errors appearing on extension page.

packages/extension/src/serviceWorker/index.ts

@@ -34,6 +34,7 @@ import { fetchDictionary } from '../utils/fetchCookieDictionary';
 import { ALLOWED_NUMBER_OF_TABS } from '../constants';
 import SynchnorousCookieStore from '../store/synchnorousCookieStore';
 import canProcessCookies from '../utils/canProcessCookies';
+import { getTab } from '../utils/getTab';
 
 let cookieDB: CookieDatabase | null = null;
 let syncCookieStore: SynchnorousCookieStore | undefined;
@@ -547,8 +548,7 @@ chrome.runtime.onMessage.addListener(async (request) => {
       !syncCookieStore?.tabs[request.payload.tabId] &&
       tabMode === 'unlimited'
     ) {
-      const tabs = await chrome.tabs.query({});
-      const currentTab = tabs.find((tab) => tab.id === request.payload.tabId);
+      const currentTab = await getTab(request.payload.tabId);
 
       syncCookieStore?.addTabData(request?.payload?.tabId);
       syncCookieStore?.updateUrl(
@@ -641,8 +641,9 @@ chrome.storage.sync.onChanged.addListener(
     }
     tabMode = changes.allowedNumberOfTabs.newValue;
 
+    const tabs = await chrome.tabs.query({});
+
     if (changes?.allowedNumberOfTabs?.newValue === 'single') {
-      const tabs = await chrome.tabs.query({});
       tabToRead = '';
 
       chrome.runtime.sendMessage({
@@ -670,19 +671,21 @@ chrome.storage.sync.onChanged.addListener(
           tabId: tab?.id,
           text: '',
         });
+
         syncCookieStore?.removeTabData(tab.id);
+
         chrome.tabs.reload(Number(tab?.id), { bypassCache: true });
         return tab;
       });
     } else {
-      const tabs = await chrome.tabs.query({});
       chrome.runtime.sendMessage({
         type: 'ServiceWorker::Popup::INITIAL_SYNC',
         payload: {
           tabMode,
           tabToRead: tabToRead,
         },
       });
+
       chrome.runtime.sendMessage({
         type: 'ServiceWorker::DevTools::INITIAL_SYNC',
         payload: {
@@ -732,26 +735,37 @@ chrome.storage.sync.onChanged.addListener(
       },
     });
 
+    const tabs = await chrome.tabs.query({});
+
     if (!changes?.isUsingCDP?.newValue) {
       await Promise.all(
-        Object.keys(syncCookieStore?.tabsData ?? {}).map(async (key) => {
+        tabs.map(async (tab) => {
+          if (!tab.id) {
+            return;
+          }
+
           try {
-            await chrome.debugger.detach({ tabId: Number(key) });
-            syncCookieStore?.removeCookieData(Number(key));
-            syncCookieStore?.sendUpdatedDataToPopupAndDevTools(Number(key));
+            await chrome.debugger.detach({ tabId: tab.id });
+            syncCookieStore?.removeCookieData(tab.id);
+            syncCookieStore?.sendUpdatedDataToPopupAndDevTools(tab.id);
           } catch (error) {
-            // Fail silently
+            // eslint-disable-next-line no-console
+            console.warn(error);
           } finally {
-            await chrome.tabs.reload(Number(key), { bypassCache: true });
+            await chrome.tabs.reload(tab.id, { bypassCache: true });
           }
         })
       );
     } else {
       await Promise.all(
-        Object.keys(syncCookieStore?.tabsData ?? {}).map(async (key) => {
-          syncCookieStore?.removeCookieData(Number(key));
-          syncCookieStore?.sendUpdatedDataToPopupAndDevTools(Number(key));
-          await chrome.tabs.reload(Number(key), { bypassCache: true });
+        tabs.map(async (tab) => {
+          if (!tab.id) {
+            return;
+          }
+
+          syncCookieStore?.removeCookieData(tab.id);
+          syncCookieStore?.sendUpdatedDataToPopupAndDevTools(tab.id);
+          await chrome.tabs.reload(tab.id, { bypassCache: true });
         })
       );
     }

packages/extension/src/store/synchnorousCookieStore.ts

@@ -126,11 +126,7 @@ class SynchnorousCookieStore {
           this.tabsData[tabId][cookieKey] = cookie;
         }
       }
-      //@ts-ignore Since this is for debugging the data to check the data being collected by the storage.
-      globalThis.PSAT = {
-        tabsData: this.tabsData,
-        tabs: this.tabs,
-      };
+
       updateCookieBadgeText(this.tabsData[tabId], tabId);
     } catch (error) {
       //Fail silently
@@ -299,6 +295,10 @@ class SynchnorousCookieStore {
    * @param {number} tabId The active tab id.
    */
   removeCookieData(tabId: number) {
+    if (!this.tabs[tabId] || !this.tabsData[tabId]) {
+      return;
+    }
+
     delete this.tabsData[tabId];
     this.tabsData[tabId] = {};
     this.tabs[tabId].newUpdates = 0;
@@ -313,6 +313,11 @@ class SynchnorousCookieStore {
     if (this.tabsData[tabId] && this.tabs[tabId]) {
       return;
     }
+    //@ts-ignore Since this is for debugging the data to check the data being collected by the storage.
+    globalThis.PSAT = {
+      tabsData: this.tabsData,
+      tabs: this.tabs,
+    };
 
     this.tabsData[tabId] = {};
     this.tabs[tabId] = {
@@ -356,6 +361,9 @@ class SynchnorousCookieStore {
     tabId: number,
     overrideForInitialSync = false
   ) {
+    if (!this.tabs[tabId] || !this.tabsData[tabId]) {
+      return;
+    }
     let sentMessageAnyWhere = false;
 
     try {
@@ -387,13 +395,12 @@ class SynchnorousCookieStore {
           },
         });
       }
-    } catch (error) {
-      // eslint-disable-next-line no-console
-      console.warn(error);
-    }
 
-    if (sentMessageAnyWhere) {
-      this.tabs[tabId].newUpdates = 0;
+      if (sentMessageAnyWhere) {
+        this.tabs[tabId].newUpdates = 0;
+      }
+    } catch (error) {
+      //Fail silently. Ignoring the console.warn here because the only error this will throw is of "Error: Could not establish connection".
     }
   }
 }

packages/extension/src/store/tests/synchnorousCookieStore.ts

@@ -24,16 +24,15 @@ let synchnorousCookieStore: SynchnorousCookieStore;
 describe('SynchnorousCookieStore:', () => {
   beforeAll(() => {
     globalThis.chrome = SinonChrome as unknown as typeof chrome;
+    synchnorousCookieStore = new SynchnorousCookieStore();
   });
 
   beforeEach(() => {
-    synchnorousCookieStore = new SynchnorousCookieStore();
     synchnorousCookieStore.addTabData(123456);
     synchnorousCookieStore.updateUrl(123456, 'https://bbc.com');
   });
 
   afterEach(() => {
-    synchnorousCookieStore = new SynchnorousCookieStore();
     synchnorousCookieStore.clear();
   });
 

packages/extension/src/store/utils/updateCookieBadgeText.ts

@@ -38,10 +38,18 @@ export default function updateCookieBadgeText(
         storage[cookieKey].frameIdList?.length >= 1
     ).length;
     if (numCookies >= 0) {
-      chrome.action.setBadgeText({
-        tabId: tabId,
-        text: numCookies.toString(),
-      });
+      chrome.action.setBadgeText(
+        {
+          tabId: tabId,
+          text: numCookies.toString(),
+        },
+        () => {
+          if (chrome.runtime.lastError) {
+            // eslint-disable-next-line no-console
+            console.warn(chrome.runtime.lastError);
+          }
+        }
+      );
     }
   } catch (error) {
     // do nothing

packages/extension/src/view/devtools/stateProviders/syncCookieStore/index.tsx

@@ -369,15 +369,20 @@ export const Provider = ({ children }: PropsWithChildren) => {
   );
 
   const tabRemovedListener = useCallback(async () => {
-    const availableTabs = await chrome.tabs.query({});
-
-    if (
-      availableTabs.length === ALLOWED_NUMBER_OF_TABS &&
-      availableTabs.filter(
-        (processingTab) => processingTab.id?.toString() === tabToRead
-      )
-    ) {
-      setReturningToSingleTab(true);
+    try {
+      const availableTabs = await chrome.tabs.query({});
+
+      if (
+        availableTabs.length === ALLOWED_NUMBER_OF_TABS &&
+        availableTabs.filter(
+          (processingTab) => processingTab.id?.toString() === tabToRead
+        )
+      ) {
+        setReturningToSingleTab(true);
+      }
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.warn(error);
     }
   }, [tabToRead]);