From 2f8838f8e2084329128a1469c095316fb39824c3 Mon Sep 17 00:00:00 2001 From: Sebastian Markbage Date: Sat, 30 Mar 2024 10:46:23 -0400 Subject: [PATCH] Finish cleaning up digest from onRecoverableError Don't need to track it separately on the captured value anymore. Shouldn't be in the types. I used a getter for the warning instead because Proxies are kind of heavy weight options for this kind of warning. We typically use getters. --- packages/react-dom/src/client/ReactDOMRoot.js | 4 +- .../src/ReactCapturedValue.js | 8 +--- .../src/ReactFiberBeginWork.js | 9 ++++- .../src/ReactFiberErrorLogger.js | 2 +- .../src/ReactFiberReconciler.js | 4 +- .../react-reconciler/src/ReactFiberRoot.js | 2 +- .../src/ReactFiberWorkLoop.js | 38 ++++++------------- .../src/ReactInternalTypes.js | 2 +- 8 files changed, 27 insertions(+), 42 deletions(-) diff --git a/packages/react-dom/src/client/ReactDOMRoot.js b/packages/react-dom/src/client/ReactDOMRoot.js index 21b08b784e6bb..9d24b0ba9ef51 100644 --- a/packages/react-dom/src/client/ReactDOMRoot.js +++ b/packages/react-dom/src/client/ReactDOMRoot.js @@ -45,7 +45,7 @@ export type CreateRootOptions = { ) => void, onRecoverableError?: ( error: mixed, - errorInfo: {+digest?: ?string, +componentStack?: ?string}, + errorInfo: {+componentStack?: ?string}, ) => void, }; @@ -71,7 +71,7 @@ export type HydrateRootOptions = { ) => void, onRecoverableError?: ( error: mixed, - errorInfo: {+digest?: ?string, +componentStack?: ?string}, + errorInfo: {+componentStack?: ?string}, ) => void, formState?: ReactFormState | null, }; diff --git a/packages/react-reconciler/src/ReactCapturedValue.js b/packages/react-reconciler/src/ReactCapturedValue.js index b4c1b88dccf0e..2b34651653bde 100644 --- a/packages/react-reconciler/src/ReactCapturedValue.js +++ b/packages/react-reconciler/src/ReactCapturedValue.js @@ -17,7 +17,6 @@ export type CapturedValue = { +value: T, source: Fiber | null, stack: string | null, - digest: string | null, }; export function createCapturedValueAtFiber( @@ -43,14 +42,12 @@ export function createCapturedValueAtFiber( value, source, stack, - digest: null, }; } export function createCapturedValueFromError( value: Error, - digest: ?string, - stack: ?string, + stack: null | string, ): CapturedValue { if (typeof stack === 'string') { CapturedStacks.set(value, stack); @@ -58,7 +55,6 @@ export function createCapturedValueFromError( return { value, source: null, - stack: stack != null ? stack : null, - digest: digest != null ? digest : null, + stack: stack, }; } diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js index 6e5f53edb796b..ab6baada6fdc2 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -2647,7 +2647,8 @@ function updateDehydratedSuspenseComponent( // get an update and we'll never be able to hydrate the final content. Let's just try the // client side render instead. let digest: ?string; - let message, stack; + let message; + let stack = null; if (__DEV__) { ({digest, message, stack} = getSuspenseInstanceFallbackErrorDetails(suspenseInstance)); @@ -2670,7 +2671,10 @@ function updateDehydratedSuspenseComponent( ); } (error: any).digest = digest; - capturedValue = createCapturedValueFromError(error, digest, stack); + capturedValue = createCapturedValueFromError( + error, + stack === undefined ? null : stack, + ); } return retrySuspenseComponentWithoutHydrating( current, @@ -2812,6 +2816,7 @@ function updateDehydratedSuspenseComponent( 'There was an error while hydrating this Suspense boundary. ' + 'Switched to client rendering.', ), + null, ); return retrySuspenseComponentWithoutHydrating( current, diff --git a/packages/react-reconciler/src/ReactFiberErrorLogger.js b/packages/react-reconciler/src/ReactFiberErrorLogger.js index 775ca9b20aa92..6b2da6508dd3c 100644 --- a/packages/react-reconciler/src/ReactFiberErrorLogger.js +++ b/packages/react-reconciler/src/ReactFiberErrorLogger.js @@ -94,7 +94,7 @@ export function defaultOnCaughtError( export function defaultOnRecoverableError( error: mixed, - errorInfo: {+digest?: ?string, +componentStack?: ?string}, + errorInfo: {+componentStack?: ?string}, ) { reportGlobalError(error); } diff --git a/packages/react-reconciler/src/ReactFiberReconciler.js b/packages/react-reconciler/src/ReactFiberReconciler.js index 6cd30c78ae901..542cfd36b14da 100644 --- a/packages/react-reconciler/src/ReactFiberReconciler.js +++ b/packages/react-reconciler/src/ReactFiberReconciler.js @@ -267,7 +267,7 @@ export function createContainer( ) => void, onRecoverableError: ( error: mixed, - errorInfo: {+digest?: ?string, +componentStack?: ?string}, + errorInfo: {+componentStack?: ?string}, ) => void, transitionCallbacks: null | TransitionTracingCallbacks, ): OpaqueRoot { @@ -313,7 +313,7 @@ export function createHydrationContainer( ) => void, onRecoverableError: ( error: mixed, - errorInfo: {+digest?: ?string, +componentStack?: ?string}, + errorInfo: {+componentStack?: ?string}, ) => void, transitionCallbacks: null | TransitionTracingCallbacks, formState: ReactFormState | null, diff --git a/packages/react-reconciler/src/ReactFiberRoot.js b/packages/react-reconciler/src/ReactFiberRoot.js index 1db2e6bda4b49..ce63425a542f6 100644 --- a/packages/react-reconciler/src/ReactFiberRoot.js +++ b/packages/react-reconciler/src/ReactFiberRoot.js @@ -160,7 +160,7 @@ export function createFiberRoot( ) => void, onRecoverableError: ( error: mixed, - errorInfo: {+digest?: ?string, +componentStack?: ?string}, + errorInfo: {+componentStack?: ?string}, ) => void, transitionCallbacks: null | TransitionTracingCallbacks, formState: ReactFormState | null, diff --git a/packages/react-reconciler/src/ReactFiberWorkLoop.js b/packages/react-reconciler/src/ReactFiberWorkLoop.js index 41a7c8d7efa4d..2570f857c7d2d 100644 --- a/packages/react-reconciler/src/ReactFiberWorkLoop.js +++ b/packages/react-reconciler/src/ReactFiberWorkLoop.js @@ -3121,37 +3121,21 @@ function commitRootImpl( } function makeErrorInfo(componentStack: ?string) { + const errorInfo = { + componentStack, + }; if (__DEV__) { - const errorInfo = { - componentStack, - }; - return new Proxy(errorInfo, { - get(target, prop, receiver) { - if (prop === 'digest') { - console.error( - 'You are accessing "digest" from the errorInfo object passed to onRecoverableError.' + - ' This property is no longer provided as part of errorInfo but can be accessed as a property' + - ' of the Error instance itself.', - ); - } - return Reflect.get(target, prop, receiver); - }, - has(target, prop) { - if (prop === 'digest') { - console.error( - 'You are accessing "digest" from the errorInfo object passed to onRecoverableError.' + - ' This property is no longer provided as part of errorInfo but can be accessed as a property' + - ' of the Error instance itself.', - ); - } - return Reflect.has(target, prop); + Object.defineProperty((errorInfo: any), 'digest', { + get() { + console.error( + 'You are accessing "digest" from the errorInfo object passed to onRecoverableError.' + + ' This property is no longer provided as part of errorInfo but can be accessed as a property' + + ' of the Error instance itself.', + ); }, }); - } else { - return { - componentStack, - }; } + return errorInfo; } function releaseRootPooledCache(root: FiberRoot, remainingLanes: Lanes) { diff --git a/packages/react-reconciler/src/ReactInternalTypes.js b/packages/react-reconciler/src/ReactInternalTypes.js index 10b65fb39280f..dac96a66dc84a 100644 --- a/packages/react-reconciler/src/ReactInternalTypes.js +++ b/packages/react-reconciler/src/ReactInternalTypes.js @@ -273,7 +273,7 @@ type BaseFiberRootProperties = { ) => void, onRecoverableError: ( error: mixed, - errorInfo: {+digest?: ?string, +componentStack?: ?string}, + errorInfo: {+componentStack?: ?string}, ) => void, formState: ReactFormState | null,