From c1f824325ca2b58dbd6c1a990c2dbf21e1508554 Mon Sep 17 00:00:00 2001
From: Kuba Janik <jakubjanik00@gmail.com>
Date: Mon, 19 Aug 2024 15:45:31 +0200
Subject: [PATCH] feat(ui-mode): pr feedback

---
 .../src/ui/networkResourceDetails.tsx             | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/packages/trace-viewer/src/ui/networkResourceDetails.tsx b/packages/trace-viewer/src/ui/networkResourceDetails.tsx
index f80ab99015..3eb2f8ef73 100644
--- a/packages/trace-viewer/src/ui/networkResourceDetails.tsx
+++ b/packages/trace-viewer/src/ui/networkResourceDetails.tsx
@@ -144,11 +144,18 @@ const FontPreview: React.FunctionComponent<{
   const [isError, setIsError] = React.useState(false);
 
   React.useEffect(() => {
-    const fontFace = new FontFace('font-preview', font);
-    if (fontFace.status === 'loaded')
-      document.fonts.add(fontFace);
-    if (fontFace.status === 'error')
+    let fontFace: FontFace;
+    try {
+      // note: constant font family name will lead to bugs
+      // when displaying two font previews.
+      fontFace = new FontFace('font-preview', font);
+      if (fontFace.status === 'loaded')
+        document.fonts.add(fontFace);
+      if (fontFace.status === 'error')
+        setIsError(true);
+    } catch {
       setIsError(true);
+    }
 
     return () => {
       document.fonts.delete(fontFace);