From 16b107c252737741417dcd2a44ac691d3e666776 Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Fri, 1 Mar 2024 15:56:43 -0600
Subject: [PATCH] Tweak Image ref handling

---
 src/components/CanvasBlurCapture.tsx | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/components/CanvasBlurCapture.tsx b/src/components/CanvasBlurCapture.tsx
index d6400646..a47d6a2a 100644
--- a/src/components/CanvasBlurCapture.tsx
+++ b/src/components/CanvasBlurCapture.tsx
@@ -24,7 +24,7 @@ export default function CanvasBlurCapture({
   quality?: number
 }) {
   const refCanvas = useRef<HTMLCanvasElement | null>(null);
-  const refImage = useRef<HTMLImageElement>();
+  const refImage = useRef(typeof Image !== 'undefined' ? new Image() : null);
   const refTimeouts = useRef<NodeJS.Timeout[]>([]);
   const refShouldCapture = useRef(true);
 
@@ -71,12 +71,11 @@ export default function CanvasBlurCapture({
       }
     };
 
-    if (!refImage.current) {
-      refImage.current = new Image();
+    if (refImage.current) {
+      refImage.current.crossOrigin = 'anonymous';
+      refImage.current.src = imageUrl;
+      refImage.current.onload = capture;
     }
-    refImage.current.crossOrigin = 'anonymous';
-    refImage.current.src = imageUrl;
-    refImage.current.onload = capture;
 
     // Attempt delayed capture in case image.onload never fires
     refTimeouts.current.push(setTimeout(capture, RETRY_DELAY));