diff --git a/package.json b/package.json
index 5bd7a5d26..c5fd3ff69 100644
--- a/package.json
+++ b/package.json
@@ -114,6 +114,7 @@
"react-contexify": "^6.0.0",
"react-dom": "18.3.1",
"react-draggable": "^4.4.4",
+ "react-error-boundary": "^4.0.13",
"react-h5-audio-player": "^3.2.0",
"react-intersection-observer": "^9.7.0",
"react-mentions": "^4.4.9",
diff --git a/ts/test/components/renderComponent.tsx b/ts/test/components/renderComponent.tsx
index ad8c46ded..35ce3a12d 100644
--- a/ts/test/components/renderComponent.tsx
+++ b/ts/test/components/renderComponent.tsx
@@ -1,13 +1,22 @@
/* eslint-disable import/no-extraneous-dependencies */
import { render, RenderOptions } from '@testing-library/react';
-import { AnimatePresence } from 'framer-motion';
+import { AnimatePresence, MotionGlobalConfig } from 'framer-motion';
import { ReactElement, ReactNode } from 'react';
import { SessionTheme } from '../../themes/SessionTheme';
+import { ErrorBoundary } from 'react-error-boundary';
const Providers = ({ children }: { children: ReactNode }) => {
+ MotionGlobalConfig.skipAnimations = false;
+
return (
- {children}
+
+ {`Failed to render a component!\n\t${JSON.stringify(children)}`}>}
+ >
+ {children}
+
+
);
};
diff --git a/ts/test/test-utils/utils/stubbing.ts b/ts/test/test-utils/utils/stubbing.ts
index 8a5f63a7b..2d61c5eff 100644
--- a/ts/test/test-utils/utils/stubbing.ts
+++ b/ts/test/test-utils/utils/stubbing.ts
@@ -86,6 +86,16 @@ export function stubWindow(fn: K, value: WindowValue)
};
}
+/**
+ * Resolves "SVGElement is undefined error" in motion components by making JSDOM treat SVG elements as regular DOM elements
+ * @link https://github.com/jsdom/jsdom/issues/2734#issuecomment-569416871
+ * */
+export function stubSVGElement() {
+ if (!globalAny.SVGElement) {
+ globalAny.SVGElement = globalAny.Element;
+ }
+}
+
export const enableLogRedirect = false;
export const stubWindowLog = () => {
diff --git a/yarn.lock b/yarn.lock
index 8f476254a..18b2c91f0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6188,6 +6188,13 @@ react-draggable@^4.4.4:
clsx "^1.1.1"
prop-types "^15.8.1"
+react-error-boundary@^4.0.13:
+ version "4.0.13"
+ resolved "https://registry.yarnpkg.com/react-error-boundary/-/react-error-boundary-4.0.13.tgz#80386b7b27b1131c5fbb7368b8c0d983354c7947"
+ integrity sha512-b6PwbdSv8XeOSYvjt8LpgpKrZ0yGdtZokYwkwV2wlcZbxgopHX/hgPl5VgpnoVOWd868n1hktM8Qm4b+02MiLQ==
+ dependencies:
+ "@babel/runtime" "^7.12.5"
+
react-h5-audio-player@^3.2.0:
version "3.9.1"
resolved "https://registry.yarnpkg.com/react-h5-audio-player/-/react-h5-audio-player-3.9.1.tgz#8a9721fd7a5ff6a9185ce626435207bee1774e83"