From df95577db0d1d7ca383f281bc1d9e6ba5579bef2 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sebastian=20Markb=C3=A5ge?= Date: Sat, 30 Mar 2024 18:32:20 -0400 Subject: [PATCH] Finish cleaning up digest from onRecoverableError (#28686) 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 | 8 ++-- .../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, 25 insertions(+), 43 deletions(-) diff --git a/packages/react-dom/src/client/ReactDOMRoot.js b/packages/react-dom/src/client/ReactDOMRoot.js index 21b08b784e..9d24b0ba9e 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 b4c1b88dcc..2b34651653 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 c45c71916f..9e745a69c5 100644 --- a/packages/react-reconciler/src/ReactFiberBeginWork.js +++ b/packages/react-reconciler/src/ReactFiberBeginWork.js @@ -2735,7 +2735,9 @@ 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, componentStack; + let message; + let stack = null; + let componentStack = null; if (__DEV__) { ({digest, message, stack, componentStack} = getSuspenseInstanceFallbackErrorDetails(suspenseInstance)); @@ -2762,8 +2764,7 @@ function updateDehydratedSuspenseComponent( (error: any).digest = digest; capturedValue = createCapturedValueFromError( error, - digest, - componentStack, + componentStack === undefined ? null : componentStack, ); } return retrySuspenseComponentWithoutHydrating( @@ -2906,6 +2907,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 775ca9b20a..6b2da6508d 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 6cd30c78ae..542cfd36b1 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 1db2e6bda4..ce63425a54 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 f9b18aff86..ea8869a4a8 100644 --- a/packages/react-reconciler/src/ReactFiberWorkLoop.js +++ b/packages/react-reconciler/src/ReactFiberWorkLoop.js @@ -3128,37 +3128,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 10b65fb392..dac96a66dc 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,