Skip to content

Commit 79ed5e1

Browse files
authored
Delete vestigial RetryAfterError logic (#23312)
This code was originally added to force a client render after receiving an error during hydration. Later we added the ForceClientRender to implement the same behavior, but scoped to an individual Suspense boundary instead of all the boundaries in the entire root. So it's now redudant. We had some test coverage already but I added another test specifically for the case of throwing a recoverable hydration error in the shell.
1 parent 80059bb commit 79ed5e1

File tree

5 files changed

+85
-44
lines changed

5 files changed

+85
-44
lines changed

packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1864,6 +1864,83 @@ describe('ReactDOMFizzServer', () => {
18641864
}
18651865
});
18661866

1867+
// @gate experimental
1868+
it(
1869+
'errors during hydration in the shell force a client render at the ' +
1870+
'root, and during the client render it recovers',
1871+
async () => {
1872+
let isClient = false;
1873+
1874+
function subscribe() {
1875+
return () => {};
1876+
}
1877+
function getClientSnapshot() {
1878+
return 'Yay!';
1879+
}
1880+
1881+
// At the time of writing, the only API that exposes whether it's currently
1882+
// hydrating is the `getServerSnapshot` API, so I'm using that here to
1883+
// simulate an error during hydration.
1884+
function getServerSnapshot() {
1885+
if (isClient) {
1886+
throw new Error('Hydration error');
1887+
}
1888+
return 'Yay!';
1889+
}
1890+
1891+
function Child() {
1892+
const value = useSyncExternalStore(
1893+
subscribe,
1894+
getClientSnapshot,
1895+
getServerSnapshot,
1896+
);
1897+
Scheduler.unstable_yieldValue(value);
1898+
return value;
1899+
}
1900+
1901+
const spanRef = React.createRef();
1902+
1903+
function App() {
1904+
return (
1905+
<span ref={spanRef}>
1906+
<Child />
1907+
</span>
1908+
);
1909+
}
1910+
1911+
await act(async () => {
1912+
const {pipe} = ReactDOMFizzServer.renderToPipeableStream(<App />);
1913+
pipe(writable);
1914+
});
1915+
expect(Scheduler).toHaveYielded(['Yay!']);
1916+
1917+
const span = container.getElementsByTagName('span')[0];
1918+
1919+
// Hydrate the tree. Child will throw during hydration, but not when it
1920+
// falls back to client rendering.
1921+
isClient = true;
1922+
ReactDOM.hydrateRoot(container, <App />, {
1923+
onRecoverableError(error) {
1924+
Scheduler.unstable_yieldValue(error.message);
1925+
},
1926+
});
1927+
1928+
// An error logged but instead of surfacing it to the UI, we switched
1929+
// to client rendering.
1930+
expect(() => {
1931+
expect(Scheduler).toFlushAndYield(['Yay!', 'Hydration error']);
1932+
}).toErrorDev(
1933+
'An error occurred during hydration. The server HTML was replaced',
1934+
{withoutStack: true},
1935+
);
1936+
expect(getVisibleChildren(container)).toEqual(<span>Yay!</span>);
1937+
1938+
// The node that's inside the boundary that errored during hydration was
1939+
// not hydrated.
1940+
expect(spanRef.current).not.toBe(span);
1941+
},
1942+
);
1943+
18671944
// @gate experimental
18681945
it(
18691946
'errors during hydration force a client render at the nearest Suspense ' +

packages/react-reconciler/src/ReactFiberBeginWork.new.js

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -225,9 +225,6 @@ import {
225225
markSkippedUpdateLanes,
226226
getWorkInProgressRoot,
227227
pushRenderLanes,
228-
getExecutionContext,
229-
RetryAfterError,
230-
NoContext,
231228
} from './ReactFiberWorkLoop.new';
232229
import {setWorkInProgressVersion} from './ReactMutableSource.new';
233230
import {
@@ -2646,14 +2643,6 @@ function updateDehydratedSuspenseComponent(
26462643
// but after we've already committed once.
26472644
warnIfHydrating();
26482645

2649-
if ((getExecutionContext() & RetryAfterError) !== NoContext) {
2650-
return retrySuspenseComponentWithoutHydrating(
2651-
current,
2652-
workInProgress,
2653-
renderLanes,
2654-
);
2655-
}
2656-
26572646
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
26582647
return retrySuspenseComponentWithoutHydrating(
26592648
current,

packages/react-reconciler/src/ReactFiberBeginWork.old.js

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -225,9 +225,6 @@ import {
225225
markSkippedUpdateLanes,
226226
getWorkInProgressRoot,
227227
pushRenderLanes,
228-
getExecutionContext,
229-
RetryAfterError,
230-
NoContext,
231228
} from './ReactFiberWorkLoop.old';
232229
import {setWorkInProgressVersion} from './ReactMutableSource.old';
233230
import {
@@ -2646,14 +2643,6 @@ function updateDehydratedSuspenseComponent(
26462643
// but after we've already committed once.
26472644
warnIfHydrating();
26482645

2649-
if ((getExecutionContext() & RetryAfterError) !== NoContext) {
2650-
return retrySuspenseComponentWithoutHydrating(
2651-
current,
2652-
workInProgress,
2653-
renderLanes,
2654-
);
2655-
}
2656-
26572646
if ((workInProgress.mode & ConcurrentMode) === NoMode) {
26582647
return retrySuspenseComponentWithoutHydrating(
26592648
current,

packages/react-reconciler/src/ReactFiberWorkLoop.new.js

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -245,11 +245,10 @@ const {
245245

246246
type ExecutionContext = number;
247247

248-
export const NoContext = /* */ 0b0000;
249-
const BatchedContext = /* */ 0b0001;
250-
const RenderContext = /* */ 0b0010;
251-
const CommitContext = /* */ 0b0100;
252-
export const RetryAfterError = /* */ 0b1000;
248+
export const NoContext = /* */ 0b000;
249+
const BatchedContext = /* */ 0b001;
250+
const RenderContext = /* */ 0b010;
251+
const CommitContext = /* */ 0b100;
253252

254253
type RootExitStatus = 0 | 1 | 2 | 3 | 4 | 5 | 6;
255254
const RootInProgress = 0;
@@ -945,9 +944,6 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
945944
}
946945

947946
function recoverFromConcurrentError(root, errorRetryLanes) {
948-
const prevExecutionContext = executionContext;
949-
executionContext |= RetryAfterError;
950-
951947
// If an error occurred during hydration, discard server response and fall
952948
// back to client side render.
953949
if (root.isDehydrated) {
@@ -970,9 +966,6 @@ function recoverFromConcurrentError(root, errorRetryLanes) {
970966
} else {
971967
// The UI failed to recover.
972968
}
973-
974-
executionContext = prevExecutionContext;
975-
976969
return exitStatus;
977970
}
978971

packages/react-reconciler/src/ReactFiberWorkLoop.old.js

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -245,11 +245,10 @@ const {
245245

246246
type ExecutionContext = number;
247247

248-
export const NoContext = /* */ 0b0000;
249-
const BatchedContext = /* */ 0b0001;
250-
const RenderContext = /* */ 0b0010;
251-
const CommitContext = /* */ 0b0100;
252-
export const RetryAfterError = /* */ 0b1000;
248+
export const NoContext = /* */ 0b000;
249+
const BatchedContext = /* */ 0b001;
250+
const RenderContext = /* */ 0b010;
251+
const CommitContext = /* */ 0b100;
253252

254253
type RootExitStatus = 0 | 1 | 2 | 3 | 4 | 5 | 6;
255254
const RootInProgress = 0;
@@ -945,9 +944,6 @@ function performConcurrentWorkOnRoot(root, didTimeout) {
945944
}
946945

947946
function recoverFromConcurrentError(root, errorRetryLanes) {
948-
const prevExecutionContext = executionContext;
949-
executionContext |= RetryAfterError;
950-
951947
// If an error occurred during hydration, discard server response and fall
952948
// back to client side render.
953949
if (root.isDehydrated) {
@@ -970,9 +966,6 @@ function recoverFromConcurrentError(root, errorRetryLanes) {
970966
} else {
971967
// The UI failed to recover.
972968
}
973-
974-
executionContext = prevExecutionContext;
975-
976969
return exitStatus;
977970
}
978971

0 commit comments

Comments
 (0)