From 15b3154dfb67f6abc17c4048a851c5553336cefd Mon Sep 17 00:00:00 2001
From: Mathieu Perreault <mathieu.perreault@shopify.com>
Date: Wed, 22 Jan 2025 13:51:12 -0500
Subject: [PATCH] Better error handling

---
 src/devtools.ts             | 20 ++++++++++++++------
 src/env.ts                  |  3 ++-
 src/utils/getProfileData.ts | 24 ++++++++++++++++--------
 3 files changed, 32 insertions(+), 15 deletions(-)

diff --git a/src/devtools.ts b/src/devtools.ts
index de1a486..678a200 100644
--- 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');
+  });
 }
\ No newline at end of file
diff --git a/src/env.ts b/src/env.ts
index 30bda5e..1085fbe 100644
--- a/src/env.ts
+++ b/src/env.ts
@@ -4,7 +4,8 @@ export enum RenderBackend {
 
 export const env = {
   OAUTH2_DOMAIN: 'accounts.shopify.com',
-  DEV_OAUTH2_DOMAIN: 'identity.myshopify.io',
+  //DEV_OAUTH2_DOMAIN: 'identity.myshopify.io',
+  DEV_OAUTH2_DOMAIN: 'identity.shopify-identity-uwam.mathieu-perreault.us.spin.dev',
   OAUTH2_CLIENT_ID: 'ff2a91a2-6854-449e-a37d-c03bcd181126',
   DEV_OAUTH2_CLIENT_ID: '1d7f695c-42e2-493a-a6dc-be12d4117d58',
   OAUTH2_SUBJECT_ID: {
diff --git a/src/utils/getProfileData.ts b/src/utils/getProfileData.ts
index 98747ec..721e093 100644
--- 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(