Merge branch 'develop' of github.com:GoogleChromeLabs/cookie-analysis…

…-tool into develop
GoogleChromeLabs · Apr 15, 2024 · eeb1e14 · eeb1e14
2 parents ee560da + b2314a5
commit eeb1e14
Show file tree

Hide file tree

Showing 7 changed files with 70 additions and 39 deletions.
diff --git a/packages/design-system/src/components/errorFallback/extensionReloadNotification.tsx b/packages/design-system/src/components/errorFallback/extensionReloadNotification.tsx
@@ -22,15 +22,33 @@ import React from 'react';
  * Internal dependencies.
  */
 import Button from '../button';
+interface ExtensionReloadNotificationProps {
+  tabId?: number;
+}
 
-const ExtensionReloadNotification = () => {
+const ExtensionReloadNotification = ({
+  tabId,
+}: ExtensionReloadNotificationProps) => {
   return (
     <div className="w-full h-full px-2 flex flex-col items-center justify-center border-b border-american-silver dark:border-quartz bg-white dark:bg-charleston-green dark:text-white">
       <p className="text-xl text-center px-4">
         Looks like extension has been updated since devtool was open.
       </p>
       <div className="ml-2 mt-4">
-        <Button onClick={() => window.location.reload()} text="Refresh panel" />
+        <Button
+          onClick={() => {
+            window.location.reload();
+            if (localStorage.getItem('psatOpenedAfterPageLoad') && tabId) {
+              try {
+                chrome.tabs.reload(tabId);
+                localStorage.removeItem('psatOpenedAfterPageLoad');
+              } catch (error) {
+                //Fail silenlty
+              }
+            }
+          }}
+          text="Refresh panel"
+        />
       </div>
     </div>
   );

diff --git a/...c/components/table/utils/precalculatedFiltersUtils/calculateBlockedReasonsFilterValues.ts b/...c/components/table/utils/precalculatedFiltersUtils/calculateBlockedReasonsFilterValues.ts
@@ -42,7 +42,7 @@ const calculateBlockedReasonsFilterValues = (
   >((acc, cookie) => {
     const blockedReason = getValueByKey('blockedReasons', cookie);
 
-    if (!cookie.frameIdList || cookie?.frameIdList?.length === 0) {
+    if (!cookie.frameIdList) {
       return acc;
     }
 

diff --git a/packages/design-system/src/utils/prepareCookiesCount.ts b/packages/design-system/src/utils/prepareCookiesCount.ts
@@ -54,13 +54,13 @@ const prepareCookiesCount = (cookies: { [key: string]: CookieData } | null) => {
   }
 
   const cookieList = Object.values(cookies).filter(
-    (cookie) => cookie.parsedCookie && cookie.frameIdList?.length > 0
+    (cookie) => cookie.parsedCookie && cookie.frameIdList?.length >= 0
   );
 
   cookiesCount.total = Object.keys(cookies).filter(
     (cookieKey) =>
       cookies[cookieKey].parsedCookie &&
-      cookies[cookieKey].frameIdList?.length > 0
+      cookies[cookieKey].frameIdList?.length >= 0
   ).length;
 
   cookiesCount.blockedCookies.total = cookieList.filter(

diff --git a/packages/extension/src/serviceWorker/index.ts b/packages/extension/src/serviceWorker/index.ts
@@ -258,7 +258,6 @@ chrome.tabs.onUpdated.addListener(async (tabId, changeInfo, tab) => {
   if (changeInfo.status === 'loading' && tab.url) {
     syncCookieStore?.removeCookieData(tabId);
   }
-
   try {
     await chrome.tabs.sendMessage(tabId, {
       tabId,
@@ -283,15 +282,6 @@ chrome.tabs.onUpdated.addListener(async (tabId, changeInfo, tab) => {
   } catch (error) {
     //Fail silently
   }
-  if (!tab.url) {
-    return;
-  }
-
-  syncCookieStore?.updateUrl(tabId, tab.url);
-
-  if (changeInfo.status === 'loading' && tab.url) {
-    syncCookieStore?.removeCookieData(tabId);
-  }
 });
 
 /**
@@ -634,28 +624,30 @@ chrome.runtime.onMessage.addListener(async (request) => {
   const incomingMessageTabId = request.payload.tabId;
 
   if (DEVTOOLS_OPEN === incomingMessageType) {
-    const dataToSend: { [key: string]: string } = {};
+    const dataToSend: { [key: string]: string | boolean } = {};
     dataToSend['tabMode'] = tabMode;
 
     if (tabMode === 'single') {
       dataToSend['tabToRead'] = tabToRead;
     }
 
-    chrome.runtime.sendMessage({
-      type: INITIAL_SYNC,
-      payload: dataToSend,
-    });
-
     if (
       !syncCookieStore?.tabs[incomingMessageTabId] &&
       tabMode === 'unlimited'
     ) {
       const currentTab = await getTab(incomingMessageTabId);
-
+      dataToSend['psatOpenedAfterPageLoad'] = request.payload.doNotReReload
+        ? false
+        : true;
       syncCookieStore?.addTabData(incomingMessageTabId);
       syncCookieStore?.updateUrl(incomingMessageTabId, currentTab?.url || '');
     }
 
+    chrome.runtime.sendMessage({
+      type: INITIAL_SYNC,
+      payload: dataToSend,
+    });
+
     syncCookieStore?.updateDevToolsState(incomingMessageTabId, true);
 
     if (syncCookieStore?.tabsData[incomingMessageTabId]) {
@@ -736,14 +728,17 @@ chrome.storage.sync.onChanged.addListener(
 
     if (changes?.allowedNumberOfTabs?.newValue === 'single') {
       tabToRead = '';
-
-      chrome.runtime.sendMessage({
-        type: INITIAL_SYNC,
-        payload: {
-          tabMode,
-          tabToRead: tabToRead,
-        },
-      });
+      try {
+        await chrome.runtime.sendMessage({
+          type: INITIAL_SYNC,
+          payload: {
+            tabMode,
+            tabToRead: tabToRead,
+          },
+        });
+      } catch (error) {
+        //Fail silently
+      }
 
       tabs.map((tab) => {
         if (!tab?.id) {
@@ -757,13 +752,17 @@ chrome.storage.sync.onChanged.addListener(
         return tab;
       });
     } else {
-      chrome.runtime.sendMessage({
-        type: INITIAL_SYNC,
-        payload: {
-          tabMode,
-          tabToRead: tabToRead,
-        },
-      });
+      try {
+        await chrome.runtime.sendMessage({
+          type: INITIAL_SYNC,
+          payload: {
+            tabMode,
+            tabToRead: tabToRead,
+          },
+        });
+      } catch (error) {
+        //Fail silently
+      }
 
       tabs.forEach((tab) => {
         if (!tab?.id) {

diff --git a/packages/extension/src/view/devtools/app.tsx b/packages/extension/src/view/devtools/app.tsx
@@ -35,6 +35,8 @@ const App: React.FC = () => {
   const [sidebarData, setSidebarData] = useState(TABS);
   const contextInvalidatedRef = useRef(null);
 
+  const tabIdRef = useRef(chrome.devtools.inspectedWindow.tabId);
+
   const contextInvalidated = useContextInvalidated(contextInvalidatedRef);
 
   const [defaultSelectedItemKey, setDefaultSelectedItemKey] = useState(
@@ -70,7 +72,7 @@ const App: React.FC = () => {
           <Layout setSidebarData={setSidebarData} />
         ) : (
           <div className="flex flex-col items-center justify-center w-full h-full">
-            <ExtensionReloadNotification />
+            <ExtensionReloadNotification tabId={tabIdRef.current} />
           </div>
         )}
       </div>

diff --git a/packages/extension/src/view/devtools/hooks/useContextInvalidated.ts b/packages/extension/src/view/devtools/hooks/useContextInvalidated.ts
@@ -87,8 +87,8 @@ const useContextInvalidated = (
               //Fail silently
             }
           }
-          localStorage.removeItem('contextInvalidated');
         }
+        localStorage.removeItem('contextInvalidated');
       }
     })();
   }, [allowedNumberOfTabs, isUsingCDP]);

diff --git a/packages/extension/src/view/devtools/stateProviders/cookie/cookieProvider.tsx b/packages/extension/src/view/devtools/stateProviders/cookie/cookieProvider.tsx
@@ -224,6 +224,7 @@ const Provider = ({ children }: PropsWithChildren) => {
         cookieData?: TabCookies;
         tabToRead?: string;
         tabMode?: string;
+        psatOpenedAfterPageLoad?: boolean;
       };
     }) => {
       if (!message.type) {
@@ -246,6 +247,13 @@ const Provider = ({ children }: PropsWithChildren) => {
       if (INITIAL_SYNC === incomingMessageType && message?.payload?.tabMode) {
         if (message.payload.tabMode === 'unlimited') {
           isCurrentTabBeingListenedToRef.current = true;
+          if (
+            Object.keys(message.payload).includes('psatOpenedAfterPageLoad') &&
+            message.payload.psatOpenedAfterPageLoad
+          ) {
+            setContextInvalidated(true);
+            localStorage.setItem('psatOpenedAfterPageLoad', 'true');
+          }
           setTabToRead(null);
         } else {
           if (tabId.toString() !== message?.payload?.tabToRead) {
@@ -364,10 +372,14 @@ const Provider = ({ children }: PropsWithChildren) => {
   }, []);
 
   useEffect(() => {
+    const doNotReReload =
+      localStorage.getItem('contextInvalidated') &&
+      !localStorage.getItem('psatOpenedAfterPageLoad');
     chrome.runtime.sendMessage({
       type: DEVTOOLS_OPEN,
       payload: {
         tabId: chrome.devtools.inspectedWindow.tabId,
+        doNotReReload,
       },
     });