Better error handling

Shopify · Jan 22, 2025 · aeda3bf · aeda3bf
1 parent 076fd60
commit aeda3bf
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 14 deletions.
diff --git a/src/devtools.ts b/src/devtools.ts
@@ -27,6 +27,7 @@ chrome.devtools.inspectedWindow.eval(
       }
 
       addEventListenerToButtons();
+      setupNavigationListener();
     }
   },
 );
@@ -49,10 +50,8 @@ function getInspectedWindowURL(): Promise<URL> {
 }
 
 async function refreshPanel() {
-  let node = document.querySelector(selectors.initialMessage)
-  while (node && node.firstChild) {
-    node.removeChild(node.firstChild);
-  }
+  document.querySelector(selectors.initialMessage)!.classList.add('hide');
+  document.querySelector(selectors.speedscopeWrapper)!.classList.add('hide');
   document
     .querySelector(selectors.speedscopeWrapper)!
     .classList.add('loading-fade');
@@ -67,7 +66,7 @@ async function refreshPanel() {
     const speedscopeIframe = document.getElementById('speedscope-iframe') as HTMLIFrameElement;
     speedscopeIframe.contentWindow?.postMessage({ 
       type: 'loadProfile', 
-      profileData: profileData
+      profileData: JSON.stringify(profileData)
     }, '*');
 
     document
@@ -76,7 +75,6 @@ async function refreshPanel() {
 
   } catch (error) {
     console.error(error);
-    document.querySelector(selectors.speedscopeWrapper)!.classList.add('hide');
     document
       .querySelector(selectors.notProfilableMessage)!
       .classList.remove('hide');
@@ -86,4 +84,14 @@ async function refreshPanel() {
   document
     .querySelector(selectors.speedscopeWrapper)!
     .classList.remove('loading-fade');
+}
+
+function setupNavigationListener() {
+  chrome.devtools.network.onNavigated.addListener(() => {
+    // Reset panel to initial state
+    document.querySelector(selectors.speedscopeWrapper)!.classList.add('hide');
+    document.querySelector(selectors.loadingAnimation)!.classList.add('hide');
+    document.querySelector(selectors.notProfilableMessage)!.classList.add('hide');
+    document.querySelector(selectors.initialMessage)!.classList.remove('hide');
+  });
 }
diff --git a/src/utils/getProfileData.ts b/src/utils/getProfileData.ts
@@ -2,16 +2,24 @@ import {SubjectAccessToken} from 'types';
 import { CoreAccessTokenResponse } from '../types/messages';
 
 export async function getProfileData(
-  url: URL): Promise<string> {
+  url: URL): Promise<any> {
 
-  const fetchOptions = {
-    headers: {
-      Accept: 'application/vnd.speedscope+json',
-      Authorization: `Bearer ${await requestAccessToken(url).then(({accessToken}) => accessToken)}`,
-    },
-  };
+  try {
+    const fetchOptions = {
+      headers: {
+        Accept: 'application/vnd.speedscope+json',
+        Authorization: `Bearer ${await requestAccessToken(url).then(({accessToken}) => accessToken)}`,
+      },
+    };
 
-  return fetch(url.href, fetchOptions).then(response => response.text());
+    const response = await fetch(url.href, fetchOptions);
+    if (!response.ok) {
+      throw new Error('Not profilable');
+    }
+    return response.json();
+  } catch (error) {
+    throw new Error('Not profilable');
+  }
 }
 
 function requestAccessToken(