Merge pull request #1562 from argos-ci/fix-can-parse-not-available

fix: fix `URL.canParse` not available

Author: gregberge

apps/frontend/src/pages/Build/BuildDetailToolbar.tsx

@@ -135,7 +135,7 @@ export const BuildDetailToolbar = memo(function BuildDetailToolbar({
               <MediaTypeIndicator mediaType={mediaType} className="size-4" />
             )}
             {viewport && <ViewportIndicator viewport={viewport} />}
-            {url && URL.canParse(url) ? (
+            {url && checkIsValidURL(url) ? (
               <UrlIndicator
                 url={url}
                 previewUrl={previewUrl}
@@ -181,6 +181,25 @@ export const BuildDetailToolbar = memo(function BuildDetailToolbar({
   );
 });
 
+/**
+ * Check if a URL can be parsed.
+ */
+function checkIsValidURL(url: string) {
+  // If browser does not support URL, return false.
+  if (typeof URL !== "function") {
+    return false;
+  }
+  // If browser does not support URL.canParse, try to parse the URL.
+  if (typeof URL.canParse !== "function") {
+    try {
+      new URL(url);
+    } catch {
+      return false;
+    }
+  }
+  return URL.canParse(url);
+}
+
 function resolveDiffMetadata(diff: Diff) {
   return (
     (diff.status === ScreenshotDiffStatus.Removed