maxjhandsome
/
react
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Land enableClientRenderFallbackOnHydrationMismatch (#24410) 

This flag is already enabled on all relevant surfaces. We can remove it.
This commit is contained in:
Andrew Clark 2022-04-20 14:09:11 -04:00 committed by GitHub
parent 354772952a
commit 0dc4e6663d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
20 changed files with 175 additions and 609 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

113
packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js vendored
View File

@ -1832,41 +1832,26 @@ describe('ReactDOMFizzServer', () => {
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(() => {
// The first paint switches to client rendering due to mismatch
expect(Scheduler).toFlushUntilNextPaint([
'client',
'Log recoverable error: Hydration failed because the initial ' +
'UI does not match what was rendered on the server.',
'Log recoverable error: There was an error while hydrating. ' +
'Because the error happened outside of a Suspense boundary, the ' +
'entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.',
'Warning: Expected server HTML to contain a matching <div> in <div>.\n' +
' in div (at **)\n' +
' in App (at **)',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(<div>client</div>);
} else {
const serverRenderedDiv = container.getElementsByTagName('div')[0];
// The first paint uses the server snapshot
expect(Scheduler).toFlushUntilNextPaint(['server']);
expect(getVisibleChildren(container)).toEqual(<div>server</div>);
// Hydration succeeded
expect(ref.current).toEqual(serverRenderedDiv);
// Asynchronously we detect that the store has changed on the client,
// and patch up the inconsistency
expect(Scheduler).toFlushUntilNextPaint(['client']);
expect(getVisibleChildren(container)).toEqual(<div>client</div>);
expect(ref.current).toEqual(serverRenderedDiv);
}
expect(() => {
// The first paint switches to client rendering due to mismatch
expect(Scheduler).toFlushUntilNextPaint([
'client',
'Log recoverable error: Hydration failed because the initial ' +
'UI does not match what was rendered on the server.',
'Log recoverable error: There was an error while hydrating. ' +
'Because the error happened outside of a Suspense boundary, the ' +
'entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.',
'Warning: Expected server HTML to contain a matching <div> in <div>.\n' +
' in div (at **)\n' +
' in App (at **)',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(<div>client</div>);
});
// The selector implementation uses the lazy ref initialization pattern
@ -1932,43 +1917,27 @@ describe('ReactDOMFizzServer', () => {
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
// The first paint uses the client due to mismatch forcing client render
expect(() => {
// The first paint switches to client rendering due to mismatch
expect(Scheduler).toFlushUntilNextPaint([
'client',
'Log recoverable error: Hydration failed because the initial ' +
'UI does not match what was rendered on the server.',
'Log recoverable error: There was an error while hydrating. ' +
'Because the error happened outside of a Suspense boundary, the ' +
'entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Warning: An error occurred during hydration. The server HTML was replaced with client content',
'Warning: Expected server HTML to contain a matching <div> in <div>.\n' +
' in div (at **)\n' +
' in App (at **)',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(<div>client</div>);
} else {
const serverRenderedDiv = container.getElementsByTagName('div')[0];
// The first paint uses the server snapshot
expect(Scheduler).toFlushUntilNextPaint(['server']);
expect(getVisibleChildren(container)).toEqual(<div>server</div>);
// Hydration succeeded
expect(ref.current).toEqual(serverRenderedDiv);
// Asynchronously we detect that the store has changed on the client,
// and patch up the inconsistency
expect(Scheduler).toFlushUntilNextPaint(['client']);
expect(getVisibleChildren(container)).toEqual(<div>client</div>);
expect(ref.current).toEqual(serverRenderedDiv);
}
// The first paint uses the client due to mismatch forcing client render
expect(() => {
// The first paint switches to client rendering due to mismatch
expect(Scheduler).toFlushUntilNextPaint([
'client',
'Log recoverable error: Hydration failed because the initial ' +
'UI does not match what was rendered on the server.',
'Log recoverable error: There was an error while hydrating. ' +
'Because the error happened outside of a Suspense boundary, the ' +
'entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Warning: An error occurred during hydration. The server HTML was replaced with client content',
'Warning: Expected server HTML to contain a matching <div> in <div>.\n' +
' in div (at **)\n' +
' in App (at **)',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(<div>client</div>);
});
// @gate experimental

205
packages/react-dom/src/__tests__/ReactDOMFizzSuppressHydrationWarning-test.js vendored
View File

@ -240,23 +240,18 @@ describe('ReactDOMFizzServerHydrationWarning', () => {
Scheduler.unstable_yieldValue(error.message);
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Expected server HTML to contain a matching <span> in <span>',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
} else {
// This used to not warn.
expect(Scheduler).toFlushAndYield([]);
}
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Expected server HTML to contain a matching <span> in <span>',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(
<div>
<span>
@ -329,23 +324,18 @@ describe('ReactDOMFizzServerHydrationWarning', () => {
Scheduler.unstable_yieldValue(error.message);
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Did not expect server HTML to contain the text node "Server" in <span>',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
} else {
// This used to not warn.
expect(Scheduler).toFlushAndYield([]);
}
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Did not expect server HTML to contain the text node "Server" in <span>',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(
<div>
<span />
@ -383,23 +373,18 @@ describe('ReactDOMFizzServerHydrationWarning', () => {
Scheduler.unstable_yieldValue(error.message);
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Expected server HTML to contain a matching text node for "Client" in <span>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
} else {
// This used to not warn.
expect(Scheduler).toFlushAndYield([]);
}
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Expected server HTML to contain a matching text node for "Client" in <span>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(
<div>
<span>
@ -440,23 +425,18 @@ describe('ReactDOMFizzServerHydrationWarning', () => {
Scheduler.unstable_yieldValue(error.message);
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Did not expect server HTML to contain the text node "Server" in <span>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
} else {
// This used to not warn.
expect(Scheduler).toFlushAndYield([]);
}
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Did not expect server HTML to contain the text node "Server" in <span>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(
<div>
<span>
@ -495,24 +475,19 @@ describe('ReactDOMFizzServerHydrationWarning', () => {
Scheduler.unstable_yieldValue(error.message);
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Expected server HTML to contain a matching text node for "Client" in <span>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
} else {
// This used to not warn.
expect(Scheduler).toFlushAndYield([]);
}
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Expected server HTML to contain a matching text node for "Client" in <span>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(
<div>
<span>
@ -627,23 +602,18 @@ describe('ReactDOMFizzServerHydrationWarning', () => {
Scheduler.unstable_yieldValue(error.message);
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Expected server HTML to contain a matching <p> in <div>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
} else {
// This used to not warn.
expect(Scheduler).toFlushAndYield([]);
}
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Expected server HTML to contain a matching <p> in <div>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(
<div>
<p>Client and server</p>
@ -679,23 +649,18 @@ describe('ReactDOMFizzServerHydrationWarning', () => {
Scheduler.unstable_yieldValue(error.message);
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Did not expect server HTML to contain a <p> in <div>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
} else {
// This used to not warn.
expect(Scheduler).toFlushAndYield([]);
}
expect(() => {
expect(Scheduler).toFlushAndYield([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.',
]);
}).toErrorDev(
[
'Did not expect server HTML to contain a <p> in <div>.',
'An error occurred during hydration. The server HTML was replaced with client content in <div>.',
],
{withoutStack: 1},
);
expect(getVisibleChildren(container)).toEqual(
<div>
<p>Client and server</p>

381
packages/react-dom/src/__tests__/ReactDOMHydrationDiff-test.js vendored
View File

@ -83,7 +83,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
if (gate(flags => flags.enableClientRenderFallbackOnTextMismatch)) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Text content did not match. Server: \\"server\\" Client: \\"client\\"
@ -262,10 +262,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <main> in <div>.
in main (at **)
@ -276,16 +273,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <main> in <div>.
in main (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -299,10 +286,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <header> in <div>.
in header (at **)
@ -313,16 +297,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <header> in <div>.
in header (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -336,10 +310,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <main> in <div>.
in main (at **)
@ -350,16 +321,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <main> in <div>.
in main (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -373,10 +334,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <footer> in <div>.
in footer (at **)
@ -387,16 +345,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <footer> in <div>.
in footer (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
});
@ -406,9 +354,7 @@ describe('ReactDOMServerHydration', () => {
function Mismatch({isClient}) {
return <div className="parent">{isClient && 'only'}</div>;
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
if (gate(flags => flags.enableClientRenderFallbackOnTextMismatch)) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Text content did not match. Server: \\"\\" Client: \\"only\\"
@ -441,10 +387,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching text node for \\"second\\" in <div>.
in div (at **)
@ -454,15 +397,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching text node for \\"second\\" in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -476,10 +410,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching text node for \\"first\\" in <div>.
in div (at **)
@ -489,15 +420,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching text node for \\"first\\" in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -511,10 +433,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching text node for \\"third\\" in <div>.
in div (at **)
@ -524,15 +443,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching text node for \\"third\\" in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
});
});
@ -548,10 +458,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <main> in <div>.
in div (at **)
@ -561,15 +468,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <main> in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -583,10 +481,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <main> in <div>.
in main (at **)
@ -598,16 +493,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <header> in <div>.
in main (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -621,10 +506,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <footer> in <div>.
in footer (at **)
@ -635,16 +517,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <main> in <div>.
in footer (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -658,10 +530,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <footer> in <div>.
in div (at **)
@ -671,15 +540,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <footer> in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
});
@ -689,10 +549,7 @@ describe('ReactDOMServerHydration', () => {
function Mismatch({isClient}) {
return <div className="parent">{!isClient && 'only'}</div>;
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain the text node \\"only\\" in <div>.
in div (at **)
@ -702,15 +559,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain the text node \\"only\\" in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -724,10 +572,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <main> in <div>.
in main (at **)
@ -739,16 +584,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain the text node \\"first\\" in <div>.
in main (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -762,10 +597,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <footer> in <div>.
in footer (at **)
@ -776,16 +608,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain the text node \\"second\\" in <div>.
in footer (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -799,10 +621,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain the text node \\"third\\" in <div>.
in div (at **)
@ -812,15 +631,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain the text node \\"third\\" in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
});
});
@ -844,20 +654,14 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
// TODO: This message doesn't seem to have any useful details.
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
// TODO: This message doesn't seem to have any useful details.
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.",
"Caught [Hydration failed because the initial UI does not match what was rendered on the server.]",
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`Array []`);
}
});
// @gate __DEV__
@ -873,10 +677,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <main> in <div>.
in div (at **)
@ -886,15 +687,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <main> in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -911,20 +703,14 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
// TODO: This message doesn't seem to have any useful details.
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
// TODO: This message doesn't seem to have any useful details.
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.",
"Caught [Hydration failed because the initial UI does not match what was rendered on the server.]",
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`Array []`);
}
});
// @gate __DEV__
@ -941,10 +727,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <p> in <div>.
in div (at **)
@ -954,15 +737,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <p> in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -978,10 +752,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <main> in <div>.
in main (at **)
@ -992,17 +763,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating this Suspense boundary. Switched to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <main> in <div>.
in main (at **)
in Suspense (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -1018,10 +778,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <footer> in <div>.
in footer (at **)
@ -1032,17 +789,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating this Suspense boundary. Switched to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <main> in <div>.
in footer (at **)
in Suspense (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -1063,14 +809,8 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
// There is no error because we don't actually hydrate fallbacks.
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`Array []`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`Array []`);
}
// There is no error because we don't actually hydrate fallbacks.
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`Array []`);
});
// @gate __DEV__
@ -1091,14 +831,8 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
// There is no error because we don't actually hydrate fallbacks.
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`Array []`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`Array []`);
}
// There is no error because we don't actually hydrate fallbacks.
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`Array []`);
});
});
@ -1118,10 +852,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <header> in <div>.
in header (at **)
@ -1134,16 +865,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <header> in <div>.
in header (at **)
in div (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -1161,10 +882,7 @@ describe('ReactDOMServerHydration', () => {
</div>
);
}
if (
gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)
) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <header> in <div>.
in div (at **)
@ -1174,15 +892,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <header> in <div>.
in div (at **)
in Mismatch (at **)",
]
`);
}
});
});
});
@ -1222,8 +931,7 @@ describe('ReactDOMServerHydration', () => {
);
}
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <footer> in <div>.
in footer (at **)
@ -1236,18 +944,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Expected server HTML to contain a matching <footer> in <div>.
in footer (at **)
in Panel (at **)
in div (at **)
in ProfileSettings (at **)
in Mismatch (at **)",
]
`);
}
});
// @gate __DEV__
@ -1284,8 +980,7 @@ describe('ReactDOMServerHydration', () => {
);
}
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <footer> in <div>.
in div (at **)
@ -1296,16 +991,6 @@ describe('ReactDOMServerHydration', () => {
"Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",
]
`);
} else {
expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`
Array [
"Warning: Did not expect server HTML to contain a <footer> in <div>.
in div (at **)
in ProfileSettings (at **)
in Mismatch (at **)",
]
`);
}
});
});
});

49
packages/react-dom/src/__tests__/ReactDOMServerPartialHydration-test.internal.js
View File

@ -224,16 +224,7 @@ describe('ReactDOMServerPartialHydration', () => {
Scheduler.unstable_yieldValue(error.message);
},
});
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
Scheduler.unstable_flushAll();
} else {
expect(() => {
Scheduler.unstable_flushAll();
}).toErrorDev(
// TODO: This error should not be logged in this case. It's a false positive.
'Did not expect server HTML to contain the text node "Hello" in <div>.',
);
}
Scheduler.unstable_flushAll();
jest.runAllTimers();
// Expect the server-generated HTML to stay intact.
@ -249,7 +240,6 @@ describe('ReactDOMServerPartialHydration', () => {
expect(container.textContent).toBe('HelloHello');
});
// @gate enableClientRenderFallbackOnHydrationMismatch
it('falls back to client rendering boundary on mismatch', async () => {
// We can't use the toErrorDev helper here because this is async.
const originalConsoleError = console.error;
@ -532,15 +522,11 @@ describe('ReactDOMServerPartialHydration', () => {
expect(container.innerHTML).toContain('<span>A</span>');
expect(container.innerHTML).not.toContain('<span>B</span>');
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(Scheduler).toHaveYielded([
'There was an error while hydrating this Suspense boundary. ' +
'Switched to client rendering.',
]);
expect(ref.current).not.toBe(span);
} else {
expect(ref.current).toBe(span);
}
expect(Scheduler).toHaveYielded([
'There was an error while hydrating this Suspense boundary. ' +
'Switched to client rendering.',
]);
expect(ref.current).not.toBe(span);
});
it('recovers with client render when server rendered additional nodes at suspense root after unsuspending', async () => {
@ -603,11 +589,7 @@ describe('ReactDOMServerPartialHydration', () => {
expect(container.innerHTML).toContain('<span>A</span>');
expect(container.innerHTML).not.toContain('<span>B</span>');
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(ref.current).not.toBe(span);
} else {
expect(ref.current).toBe(span);
}
expect(ref.current).not.toBe(span);
if (__DEV__) {
expect(mockError).toHaveBeenCalledWith(
'Warning: Did not expect server HTML to contain a <%s> in <%s>.%s',
@ -660,20 +642,14 @@ describe('ReactDOMServerPartialHydration', () => {
});
});
}).toErrorDev('Did not expect server HTML to contain a <span> in <div>');
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(Scheduler).toHaveYielded([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating this Suspense boundary. Switched to client rendering.',
]);
}
expect(Scheduler).toHaveYielded([
'Hydration failed because the initial UI does not match what was rendered on the server.',
'There was an error while hydrating this Suspense boundary. Switched to client rendering.',
]);
expect(container.innerHTML).toContain('<span>A</span>');
expect(container.innerHTML).not.toContain('<span>B</span>');
if (gate(flags => flags.enableClientRenderFallbackOnHydrationMismatch)) {
expect(ref.current).not.toBe(span);
} else {
expect(ref.current).toBe(span);
}
expect(ref.current).not.toBe(span);
});
it('calls the onDeleted hydration callback if the parent gets deleted', async () => {
@ -3292,7 +3268,6 @@ describe('ReactDOMServerPartialHydration', () => {
itHydratesWithoutMismatch('an empty string in class component', TestAppClass);
// @gate enableClientRenderFallbackOnHydrationMismatch
it('fallback to client render on hydration mismatch at root', async () => {
let isClient = false;
let suspend = true;

16
packages/react-dom/src/client/ReactDOMHostConfig.js vendored
View File

@ -62,7 +62,6 @@ import dangerousStyleValue from '../shared/dangerousStyleValue';
import {retryIfBlockedOn} from '../events/ReactDOMEventReplaying';
import {
enableClientRenderFallbackOnHydrationMismatch,
enableCreateEventHandleAPI,
enableScopeAPI,
} from 'shared/ReactFeatureFlags';
@ -1005,10 +1004,7 @@ export function didNotHydrateInstance(
isConcurrentMode: boolean,
) {
if (__DEV__) {
if (
(enableClientRenderFallbackOnHydrationMismatch && isConcurrentMode) ||
parentProps[SUPPRESS_HYDRATION_WARNING] !== true
) {
if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING] !== true) {
if (instance.nodeType === ELEMENT_NODE) {
warnForDeletedHydratableElement(parentInstance, (instance: any));
} else if (instance.nodeType === COMMENT_NODE) {
@ -1089,10 +1085,7 @@ export function didNotFindHydratableInstance(
isConcurrentMode: boolean,
) {
if (__DEV__) {
if (
(enableClientRenderFallbackOnHydrationMismatch && isConcurrentMode) ||
parentProps[SUPPRESS_HYDRATION_WARNING] !== true
) {
if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING] !== true) {
warnForInsertedHydratedElement(parentInstance, type, props);
}
}
@ -1106,10 +1099,7 @@ export function didNotFindHydratableTextInstance(
isConcurrentMode: boolean,
) {
if (__DEV__) {
if (
(enableClientRenderFallbackOnHydrationMismatch && isConcurrentMode) ||
parentProps[SUPPRESS_HYDRATION_WARNING] !== true
) {
if (isConcurrentMode || parentProps[SUPPRESS_HYDRATION_WARNING] !== true) {
warnForInsertedHydratedText(parentInstance, text);
}
}

2
packages/react-reconciler/src/ReactFiberCompleteWork.new.js
View File

@ -31,7 +31,6 @@ import type {SuspenseContext} from './ReactFiberSuspenseContext.new';
import type {OffscreenState} from './ReactFiberOffscreenComponent';
import type {Cache} from './ReactFiberCacheComponent.new';
import {
enableClientRenderFallbackOnHydrationMismatch,
enableSuspenseAvoidThisFallback,
enableLegacyHidden,
} from 'shared/ReactFeatureFlags';
@ -1066,7 +1065,6 @@ function completeWork(
const nextState: null | SuspenseState = workInProgress.memoizedState;
if (
enableClientRenderFallbackOnHydrationMismatch &&
hasUnhydratedTailNodes() &&
(workInProgress.mode & ConcurrentMode) !== NoMode &&
(workInProgress.flags & DidCapture) === NoFlags

2
packages/react-reconciler/src/ReactFiberCompleteWork.old.js
View File

@ -31,7 +31,6 @@ import type {SuspenseContext} from './ReactFiberSuspenseContext.old';
import type {OffscreenState} from './ReactFiberOffscreenComponent';
import type {Cache} from './ReactFiberCacheComponent.old';
import {
enableClientRenderFallbackOnHydrationMismatch,
enableSuspenseAvoidThisFallback,
enableLegacyHidden,
} from 'shared/ReactFeatureFlags';
@ -1066,7 +1065,6 @@ function completeWork(
const nextState: null | SuspenseState = workInProgress.memoizedState;
if (
enableClientRenderFallbackOnHydrationMismatch &&
hasUnhydratedTailNodes() &&
(workInProgress.mode & ConcurrentMode) !== NoMode &&
(workInProgress.flags & DidCapture) === NoFlags

2
packages/react-reconciler/src/ReactFiberHydrationContext.new.js
View File

@ -68,7 +68,6 @@ import {
didNotFindHydratableTextInstance,
didNotFindHydratableSuspenseInstance,
} from './ReactFiberHostConfig';
import {enableClientRenderFallbackOnHydrationMismatch} from 'shared/ReactFeatureFlags';
import {OffscreenLane} from './ReactFiberLane.new';
import {
getSuspendedTreeContext,
@ -378,7 +377,6 @@ function tryHydrate(fiber, nextInstance) {
function shouldClientRenderOnMismatch(fiber: Fiber) {
return (
enableClientRenderFallbackOnHydrationMismatch &&
(fiber.mode & ConcurrentMode) !== NoMode &&
(fiber.flags & DidCapture) === NoFlags
);

2
packages/react-reconciler/src/ReactFiberHydrationContext.old.js
View File

@ -68,7 +68,6 @@ import {
didNotFindHydratableTextInstance,
didNotFindHydratableSuspenseInstance,
} from './ReactFiberHostConfig';
import {enableClientRenderFallbackOnHydrationMismatch} from 'shared/ReactFeatureFlags';
import {OffscreenLane} from './ReactFiberLane.old';
import {
getSuspendedTreeContext,
@ -378,7 +377,6 @@ function tryHydrate(fiber, nextInstance) {
function shouldClientRenderOnMismatch(fiber: Fiber) {
return (
enableClientRenderFallbackOnHydrationMismatch &&
(fiber.mode & ConcurrentMode) !== NoMode &&
(fiber.flags & DidCapture) === NoFlags
);

2
packages/react-reconciler/src/__tests__/useMutableSourceHydration-test.js vendored
View File

@ -169,7 +169,7 @@ describe('useMutableSourceHydration', () => {
});
// @gate enableUseMutableSource
// @gate enableClientRenderFallbackOnHydrationMismatch
// @gate enableClientRenderFallbackOnTextMismatch
it('should detect a tear before hydrating a component', () => {
const source = createSource('one');
const mutableSource = createMutableSource(source, param => param.version);

1
packages/shared/ReactFeatureFlags.js
View File

@ -41,7 +41,6 @@ export const skipUnmountedBoundaries = true;
export const enableSuspenseLayoutEffectSemantics = true;
// TODO: Finish rolling out in www
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableClientRenderFallbackOnTextMismatch = true;
// TODO: Need to review this code one more time before landing

1
packages/shared/forks/ReactFeatureFlags.native-fb.js
View File

@ -50,7 +50,6 @@ export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = true;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableClientRenderFallbackOnTextMismatch = true;
export const enableComponentStackLocations = false;
export const enableLegacyFBSupport = false;

1
packages/shared/forks/ReactFeatureFlags.native-oss.js
View File

@ -41,7 +41,6 @@ export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableClientRenderFallbackOnTextMismatch = true;
export const enableComponentStackLocations = false;
export const enableLegacyFBSupport = false;

1
packages/shared/forks/ReactFeatureFlags.test-renderer.js
View File

@ -41,7 +41,6 @@ export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableClientRenderFallbackOnTextMismatch = true;
export const enableComponentStackLocations = true;
export const enableLegacyFBSupport = false;

1
packages/shared/forks/ReactFeatureFlags.test-renderer.native.js
View File

@ -51,7 +51,6 @@ export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableClientRenderFallbackOnTextMismatch = true;
export const enableStrictEffects = false;
export const createRootStrictEffectsByDefault = false;

1
packages/shared/forks/ReactFeatureFlags.test-renderer.www.js
View File

@ -41,7 +41,6 @@ export const enableSuspenseAvoidThisFallback = true;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableClientRenderFallbackOnTextMismatch = true;
export const enableComponentStackLocations = true;
export const enableLegacyFBSupport = false;

1
packages/shared/forks/ReactFeatureFlags.testing.js
View File

@ -41,7 +41,6 @@ export const enableSuspenseAvoidThisFallback = false;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = false;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableClientRenderFallbackOnTextMismatch = true;
export const enableComponentStackLocations = true;
export const enableLegacyFBSupport = false;

1
packages/shared/forks/ReactFeatureFlags.testing.www.js
View File

@ -41,7 +41,6 @@ export const enableSuspenseAvoidThisFallback = true;
export const enableSuspenseAvoidThisFallbackFizz = false;
export const enableCPUSuspense = true;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = true;
export const enableClientRenderFallbackOnHydrationMismatch = true;
export const enableClientRenderFallbackOnTextMismatch = true;
export const enableComponentStackLocations = true;
export const enableLegacyFBSupport = !__EXPERIMENTAL__;

1
packages/shared/forks/ReactFeatureFlags.www-dynamic.js
View File

@ -26,7 +26,6 @@ export const enableLazyContextPropagation = __VARIANT__;
export const enableSyncDefaultUpdates = __VARIANT__;
export const consoleManagedByDevToolsDuringStrictMode = __VARIANT__;
export const enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay = __VARIANT__;
export const enableClientRenderFallbackOnHydrationMismatch = __VARIANT__;
export const enableClientRenderFallbackOnTextMismatch = __VARIANT__;
export const enableTransitionTracing = __VARIANT__;
export const enableSymbolFallbackForWWW = __VARIANT__;

1
packages/shared/forks/ReactFeatureFlags.www.js
View File

@ -32,7 +32,6 @@ export const {
enableLazyContextPropagation,
enableSyncDefaultUpdates,
enableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay,
enableClientRenderFallbackOnHydrationMismatch,
enableClientRenderFallbackOnTextMismatch,
} = dynamicFeatureFlags;