From 7bc42423c0ce0594e7f528bd6854027b406160b2 Mon Sep 17 00:00:00 2001
From: Anton Arnautov <arnautov.anton@gmail.com>
Date: Thu, 23 Feb 2023 20:33:20 +0100
Subject: [PATCH] feat(Reactions): add proper error handling to
 getImageDimensions

---
 src/components/Reactions/SpriteImage.tsx | 3 ++-
 src/components/Reactions/utils/utils.tsx | 4 +++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/Reactions/SpriteImage.tsx b/src/components/Reactions/SpriteImage.tsx
index 2f416d950d..415824812f 100644
--- a/src/components/Reactions/SpriteImage.tsx
+++ b/src/components/Reactions/SpriteImage.tsx
@@ -24,7 +24,7 @@ export const SpriteImage = ({
   const [[spriteWidth, spriteHeight], setSpriteDimensions] = useState([0, 0]);
 
   useEffect(() => {
-    getImageDimensions(spriteUrl).then(setSpriteDimensions);
+    getImageDimensions(spriteUrl).then(setSpriteDimensions).catch(console.error);
   }, [spriteUrl]);
 
   const [x, y] = position;
@@ -42,6 +42,7 @@ export const SpriteImage = ({
 
   return (
     <div
+      data-testid='sprite-image'
       style={{
         backgroundImage: `url('${spriteUrl}')`,
         backgroundPosition: `${x * (100 / (columns - 1))}% ${y * (100 / (rows - 1))}%`,
diff --git a/src/components/Reactions/utils/utils.tsx b/src/components/Reactions/utils/utils.tsx
index e012f001e9..a8ff88229e 100644
--- a/src/components/Reactions/utils/utils.tsx
+++ b/src/components/Reactions/utils/utils.tsx
@@ -19,7 +19,9 @@ export const getImageDimensions = (source: string) =>
       { once: true },
     );
 
-    image.addEventListener('error', reject, { once: true });
+    image.addEventListener('error', () => reject(`Couldn't load image from ${source}`), {
+      once: true,
+    });
 
     image.src = source;
   });