[react-dom] Add types for onUncaughtError and onCaughtError

Types for facebook/react#28641
eps1lon · Mar 27, 2024 · 67b6b76 · 67b6b76
1 parent 212dfbf
commit 67b6b76
Show file tree

Hide file tree

Showing 2 changed files with 58 additions and 0 deletions.
diff --git a/types/react-dom/canary.d.ts b/types/react-dom/canary.d.ts
@@ -145,8 +145,22 @@ declare module "./client" {
         [REACT_FORM_STATE_SIGIL]: never;
     }
 
+    interface RootOptions {
+        formState?: ReactFormState | null;
+        onUncaughtError?: (error: unknown, errorInfo: { componentStack?: string | undefined }) => void;
+        onCaughtError?: (
+            error: unknown,
+            errorInfo: { componentStack?: string | undefined; errorBoundary?: React.Component<unknown> | undefined },
+        ) => void;
+    }
+
     interface HydrationOptions {
         formState?: ReactFormState | null;
+        onUncaughtError?: (error: unknown, errorInfo: { componentStack?: string | undefined }) => void;
+        onCaughtError?: (
+            error: unknown,
+            errorInfo: { componentStack?: string | undefined; errorBoundary?: React.Component<unknown> | undefined },
+        ) => void;
     }
 
     interface DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_CREATE_ROOT_CONTAINERS {

diff --git a/types/react-dom/test/canary-tests.tsx b/types/react-dom/test/canary-tests.tsx
@@ -265,4 +265,48 @@ function formTest() {
 function createRoot(validContainer: Element | DocumentFragment | Document) {
     ReactDOMClient.createRoot(document);
     ReactDOMClient.createRoot(validContainer);
+
+    ReactDOMClient.createRoot(document, {
+        onUncaughtError: (error, errorInfo) => {
+            // $ExpectType unknown
+            error;
+            // $ExpectType string | undefined
+            errorInfo.componentStack;
+            // @ts-expect-error -- only on onRecoverableError
+            errorInfo.digest;
+            // @ts-expect-error -- only on onCaughtError
+            errorInfo.errorBoundary;
+        },
+        onCaughtError: (error, errorInfo) => {
+            // $ExpectType unknown
+            error;
+            // $ExpectType string | undefined
+            errorInfo.componentStack;
+            // @ts-expect-error -- only on onRecoverableError
+            errorInfo.digest;
+            // $ExpectType Component<unknown, {}, any> | undefined
+            errorInfo.errorBoundary;
+        },
+    });
+
+    ReactDOMClient.hydrateRoot(document.body, null, {
+        onUncaughtError: (error, errorInfo) => {
+            // $ExpectType unknown
+            error;
+            // $ExpectType string | undefined
+            errorInfo.componentStack;
+            // @ts-expect-error -- only on onRecoverableError
+            errorInfo.digest;
+        },
+        onCaughtError: (error, errorInfo) => {
+            // $ExpectType unknown
+            error;
+            // $ExpectType string | undefined
+            errorInfo.componentStack;
+            // @ts-expect-error -- only on onRecoverableError
+            errorInfo.digest;
+            // $ExpectType Component<unknown, {}, any> | undefined
+            errorInfo.errorBoundary;
+        },
+    });
 }