@samitouri / QOS-React-2 / commits / 84c84d72f1

Remove enableClientRenderFallbackOnTextMismatch flag (#28458)

Build on top of #28440. This lets us remove the path where updates are tracked on differences in text.

Sebastian Markbåge committed Mar 26, 2024 at 14:55 UTC 84c84d72f11ff1961a103b3cd59919876e48f759

19 files changed +68 -292

packages/react-dom-bindings/src/client/ReactDOMComponent.js

+3 -16

@@ -68,7 +68,6 @@ import sanitizeURL from '../shared/sanitizeURL';

68 import {

69 enableBigIntSupport,

70 enableCustomElementPropertySupport,

71 - enableClientRenderFallbackOnTextMismatch,

71 disableIEWorkarounds,

72 enableTrustedTypesIntegration,

73 enableFilterEmptyStringAttributesDOM,

@@ -351,11 +350,9 @@ export function checkForUnmatchedText(

350 }

351 }

352

354 - if (enableClientRenderFallbackOnTextMismatch) {

355 - // In concurrent roots, we throw when there's a text mismatch and revert to

356 - // client rendering, up to the nearest Suspense boundary.

357 - throw new Error('Text content does not match server-rendered HTML.');

358 - }

353 + // In concurrent roots, we throw when there's a text mismatch and revert to

354 + // client rendering, up to the nearest Suspense boundary.

355 + throw new Error('Text content does not match server-rendered HTML.');

356 }

357

358 function noop() {}

@@ -2865,16 +2862,6 @@ export function diffHydratedProperties(

2862 if (props.suppressHydrationWarning !== true) {

2863 checkForUnmatchedText(domElement.textContent, children, shouldWarnDev);

2864 }

2868 - if (!enableClientRenderFallbackOnTextMismatch) {

2869 - // We really should be patching this in the commit phase but since

2870 - // this only affects legacy mode hydration which is deprecated anyway

2871 - // we can get away with it.

2872 - // Host singletons get their children appended and don't use the text

2873 - // content mechanism.

2874 - if (tag !== 'body') {

2875 - domElement.textContent = (children: any);

2876 - }

2877 - }

2865 }

2866 }

2867

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

-2

@@ -4419,7 +4419,6 @@ describe('ReactDOMFizzServer', () => {

4419 );

4420 });

4421

4422 - // @gate enableClientRenderFallbackOnTextMismatch

4422 it('#24384: Suspending should halt hydration warnings but still emit hydration warnings after unsuspending if mismatches are genuine', async () => {

4423 const makeApp = () => {

4424 let resolve, resolved;

@@ -4505,7 +4504,6 @@ describe('ReactDOMFizzServer', () => {

4504 await waitForAll([]);

4505 });

4506

4508 - // @gate enableClientRenderFallbackOnTextMismatch

4507 it('only warns once on hydration mismatch while within a suspense boundary', async () => {

4508 const originalConsoleError = console.error;

4509 const mockError = jest.fn();

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

-120

@@ -130,7 +130,6 @@ describe('ReactDOMFizzServerHydrationWarning', () => {

130 : children;

131 }

132

133 - // @gate enableClientRenderFallbackOnTextMismatch

133 it('suppresses but does not fix text mismatches with suppressHydrationWarning', async () => {

134 function App({isClient}) {

135 return (

@@ -170,47 +169,6 @@ describe('ReactDOMFizzServerHydrationWarning', () => {

169 );

170 });

171

173 - // @gate !enableClientRenderFallbackOnTextMismatch

174 - it('suppresses and fixes text mismatches with suppressHydrationWarning', async () => {

175 - function App({isClient}) {

176 - return (

177 - <div>

178 - <span suppressHydrationWarning={true}>

179 - {isClient ? 'Client Text' : 'Server Text'}

180 - </span>

181 - <span suppressHydrationWarning={true}>{isClient ? 2 : 1}</span>

182 - </div>

183 - );

184 - }

185 - await act(() => {

186 - const {pipe} = ReactDOMFizzServer.renderToPipeableStream(

187 - <App isClient={false} />,

188 - );

189 - pipe(writable);

190 - });

191 - expect(getVisibleChildren(container)).toEqual(

192 - <div>

193 - <span>Server Text</span>

194 - <span>1</span>

195 - </div>,

196 - );

197 - ReactDOMClient.hydrateRoot(container, <App isClient={true} />, {

198 - onRecoverableError(error) {

199 - // Don't miss a hydration error. There should be none.

200 - Scheduler.log(error.message);

201 - },

202 - });

203 - await waitForAll([]);

204 - // The text mismatch should be *silently* fixed. Even in production.

205 - expect(getVisibleChildren(container)).toEqual(

206 - <div>

207 - <span>Client Text</span>

208 - <span>2</span>

209 - </div>,

210 - );

211 - });

212 -

213 - // @gate enableClientRenderFallbackOnTextMismatch

172 it('suppresses but does not fix multiple text node mismatches with suppressHydrationWarning', async () => {

173 function App({isClient}) {

174 return (

@@ -252,48 +210,6 @@ describe('ReactDOMFizzServerHydrationWarning', () => {

210 );

211 });

212

255 - // @gate !enableClientRenderFallbackOnTextMismatch

256 - it('suppresses and fixes multiple text node mismatches with suppressHydrationWarning', async () => {

257 - function App({isClient}) {

258 - return (

259 - <div>

260 - <span suppressHydrationWarning={true}>

261 - {isClient ? 'Client1' : 'Server1'}

262 - {isClient ? 'Client2' : 'Server2'}

263 - </span>

264 - </div>

265 - );

266 - }

267 - await act(() => {

268 - const {pipe} = ReactDOMFizzServer.renderToPipeableStream(

269 - <App isClient={false} />,

270 - );

271 - pipe(writable);

272 - });

273 - expect(getVisibleChildren(container)).toEqual(

274 - <div>

275 - <span>

276 - {'Server1'}

277 - {'Server2'}

278 - </span>

279 - </div>,

280 - );

281 - ReactDOMClient.hydrateRoot(container, <App isClient={true} />, {

282 - onRecoverableError(error) {

283 - Scheduler.log(error.message);

284 - },

285 - });

286 - await waitForAll([]);

287 - expect(getVisibleChildren(container)).toEqual(

288 - <div>

289 - <span>

290 - {'Client1'}

291 - {'Client2'}

292 - </span>

293 - </div>,

294 - );

295 - });

296 -

213 it('errors on text-to-element mismatches with suppressHydrationWarning', async () => {

214 function App({isClient}) {

215 return (

@@ -345,7 +261,6 @@ describe('ReactDOMFizzServerHydrationWarning', () => {

261 );

262 });

263

348 - // @gate enableClientRenderFallbackOnTextMismatch

264 it('suppresses but does not fix client-only single text node mismatches with suppressHydrationWarning', async () => {

265 function App({text}) {

266 return (

@@ -386,41 +301,6 @@ describe('ReactDOMFizzServerHydrationWarning', () => {

301 );

302 });

303

389 - // @gate !enableClientRenderFallbackOnTextMismatch

390 - it('suppresses and fixes client-only single text node mismatches with suppressHydrationWarning', async () => {

391 - function App({isClient}) {

392 - return (

393 - <div>

394 - <span suppressHydrationWarning={true}>

395 - {isClient ? 'Client' : null}

396 - </span>

397 - </div>

398 - );

399 - }

400 - await act(() => {

401 - const {pipe} = ReactDOMFizzServer.renderToPipeableStream(

402 - <App isClient={false} />,

403 - );

404 - pipe(writable);

405 - });

406 - expect(getVisibleChildren(container)).toEqual(

407 - <div>

408 - <span />

409 - </div>,

410 - );

411 - ReactDOMClient.hydrateRoot(container, <App isClient={true} />, {

412 - onRecoverableError(error) {

413 - Scheduler.log(error.message);

414 - },

415 - });

416 - await waitForAll([]);

417 - expect(getVisibleChildren(container)).toEqual(

418 - <div>

419 - <span>{'Client'}</span>

420 - </div>,

421 - );

422 - });

423 -

304 // TODO: This behavior is not consistent with client-only single text node.

305

306 it('errors on server-only single text node mismatches with suppressHydrationWarning', async () => {

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

-2

@@ -6446,7 +6446,6 @@ body {

6446 );

6447 });

6448

6449 - // @gate enableClientRenderFallbackOnTextMismatch

6449 it('retains styles even when a new html, head, and/body mount', async () => {

6450 await act(() => {

6451 const {pipe} = renderToPipeableStream(

@@ -8232,7 +8231,6 @@ background-color: green;

8231 ]);

8232 });

8233

8235 - // @gate enableClientRenderFallbackOnTextMismatch || !__DEV__

8234 it('can render a title before a singleton even if that singleton clears its contents', async () => {

8235 await act(() => {

8236 const {pipe} = renderToPipeableStream(

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

+31 -62

@@ -80,28 +80,17 @@ describe('ReactDOMServerHydration', () => {

80 </div>

81 );

82 }

83 - if (gate(flags => flags.enableClientRenderFallbackOnTextMismatch)) {

84 - expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`

85 - [

86 - "Warning: Text content did not match. Server: "server" Client: "client"

87 - in main (at **)

88 - in div (at **)

89 - in Mismatch (at **)",

90 - "Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.",

91 - "Caught [Text content does not match server-rendered HTML.]",

92 - "Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",

93 - ]

94 - `);

95 - } else {

96 - expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`

97 - [

98 - "Warning: Text content did not match. Server: "server" Client: "client"

99 - in main (at **)

100 - in div (at **)

101 - in Mismatch (at **)",

102 - ]

103 - `);

104 - }

83 + expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`

84 + [

85 + "Warning: Text content did not match. Server: "server" Client: "client"

86 + in main (at **)

87 + in div (at **)

88 + in Mismatch (at **)",

89 + "Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.",

90 + "Caught [Text content does not match server-rendered HTML.]",

91 + "Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",

92 + ]

93 + `);

94 });

96 // @gate __DEV__

@@ -118,26 +107,16 @@ describe('ReactDOMServerHydration', () => {

107 }

108

109 /* eslint-disable no-irregular-whitespace */

121 - if (gate(flags => flags.enableClientRenderFallbackOnTextMismatch)) {

122 - expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`

123 - [

124 - "Warning: Text content did not match. Server: "This markup contains an nbsp entity: server text" Client: "This markup contains an nbsp entity: client text"

125 - in div (at **)

126 - in Mismatch (at **)",

127 - "Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.",

128 - "Caught [Text content does not match server-rendered HTML.]",

129 - "Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",

130 - ]

131 - `);

132 - } else {

133 - expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`

134 - [

135 - "Warning: Text content did not match. Server: "This markup contains an nbsp entity: server text" Client: "This markup contains an nbsp entity: client text"

136 - in div (at **)

137 - in Mismatch (at **)",

138 - ]

139 - `);

140 - }

110 + expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`

111 + [

112 + "Warning: Text content did not match. Server: "This markup contains an nbsp entity: server text" Client: "This markup contains an nbsp entity: client text"

113 + in div (at **)

114 + in Mismatch (at **)",

115 + "Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.",

116 + "Caught [Text content does not match server-rendered HTML.]",

117 + "Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",

118 + ]

119 + `);

120 /* eslint-enable no-irregular-whitespace */

121 });

122

@@ -388,26 +367,16 @@ describe('ReactDOMServerHydration', () => {

367 function Mismatch({isClient}) {

368 return <div className="parent">{isClient && 'only'}</div>;

369 }

391 - if (gate(flags => flags.enableClientRenderFallbackOnTextMismatch)) {

392 - expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`

393 - [

394 - "Warning: Text content did not match. Server: "" Client: "only"

395 - in div (at **)

396 - in Mismatch (at **)",

397 - "Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.",

398 - "Caught [Text content does not match server-rendered HTML.]",

399 - "Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",

400 - ]

401 - `);

402 - } else {

403 - expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`

404 - [

405 - "Warning: Text content did not match. Server: "" Client: "only"

406 - in div (at **)

407 - in Mismatch (at **)",

408 - ]

409 - `);

410 - }

370 + expect(testMismatch(Mismatch)).toMatchInlineSnapshot(`

371 + [

372 + "Warning: Text content did not match. Server: "" Client: "only"

373 + in div (at **)

374 + in Mismatch (at **)",

375 + "Warning: An error occurred during hydration. The server HTML was replaced with client content in <div>.",

376 + "Caught [Text content does not match server-rendered HTML.]",

377 + "Caught [There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.]",

378 + ]

379 + `);

380 });

381

382 // @gate __DEV__

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

+6 -10

@@ -18,7 +18,6 @@ let React;

18 let ReactDOM;

19 let ReactDOMClient;

20 let ReactDOMServer;

21 -let ReactFeatureFlags;

22 function initModules() {

23 jest.resetModules();

@@ -26,7 +25,6 @@ function initModules() {

25 ReactDOM = require('react-dom');

26 ReactDOMClient = require('react-dom/client');

27 ReactDOMServer = require('react-dom/server');

29 - ReactFeatureFlags = require('shared/ReactFeatureFlags');

29 // Make them available to the helpers.

30 return {

@@ -843,16 +841,15 @@ describe('ReactDOMServerIntegration', () => {

841 if (

842 render === serverRender ||

843 render === streamRender ||

846 - (render === clientRenderOnServerString &&

847 - ReactFeatureFlags.enableClientRenderFallbackOnTextMismatch)

844 + render === clientRenderOnServerString

845 ) {

846 expect(e.childNodes.length).toBe(1);

850 - // Everything becomes LF when parsed from server HTML or hydrated if enableClientRenderFallbackOnTextMismatch is on.

847 + // Everything becomes LF when parsed from server HTML or hydrated.

848 // Null character is ignored.

849 expectNode(e.childNodes[0], TEXT_NODE_TYPE, 'foo\nbar\nbaz\nqux');

850 } else {

851 expect(e.childNodes.length).toBe(1);

855 - // Client rendering (or hydration without enableClientRenderFallbackOnTextMismatch) uses JS value with CR.

852 + // Client rendering uses JS value with CR.

853 // Null character stays.

854

855 expectNode(

@@ -876,19 +873,18 @@ describe('ReactDOMServerIntegration', () => {

873 if (

874 render === serverRender ||

875 render === streamRender ||

879 - (render === clientRenderOnServerString &&

880 - ReactFeatureFlags.enableClientRenderFallbackOnTextMismatch)

876 + render === clientRenderOnServerString

877 ) {

878 // We have three nodes because there is a comment between them.

879 expect(e.childNodes.length).toBe(3);

884 - // Everything becomes LF when parsed from server HTML or hydrated if enableClientRenderFallbackOnTextMismatch is on.

880 + // Everything becomes LF when parsed from server HTML or hydrated.

881 // Null character is ignored.

882 expectNode(e.childNodes[0], TEXT_NODE_TYPE, 'foo\nbar');

883 expectNode(e.childNodes[2], TEXT_NODE_TYPE, '\nbaz\nqux');

884 } else if (render === clientRenderOnServerString) {

885 // We have three nodes because there is a comment between them.

886 expect(e.childNodes.length).toBe(3);

891 - // Hydration without enableClientRenderFallbackOnTextMismatch uses JS value with CR and null character.

887 + // Hydration uses JS value with CR and null character.

888

889 expectNode(e.childNodes[0], TEXT_NODE_TYPE, 'foo\rbar');

890 expectNode(e.childNodes[2], TEXT_NODE_TYPE, '\r\nbaz\nqux\u0000');

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

-2

@@ -4059,7 +4059,6 @@ describe('ReactDOMServerPartialHydration', () => {

4059 );

4060 });

4061

4062 - // @gate enableClientRenderFallbackOnTextMismatch

4062 it("falls back to client rendering when there's a text mismatch (direct text child)", async () => {

4063 function DirectTextChild({text}) {

4064 return <div>{text}</div>;

@@ -4091,7 +4090,6 @@ describe('ReactDOMServerPartialHydration', () => {

4090 ]);

4091 });

4092

4094 - // @gate enableClientRenderFallbackOnTextMismatch

4093 it("falls back to client rendering when there's a text mismatch (text child with siblings)", async () => {

4094 function Sibling() {

4095 return 'Sibling';

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

+9 -18

@@ -265,9 +265,6 @@ describe('rendering React components at document', () => {

265 );

266 const testDocument = getTestDocument(markup);

267

268 - const enableClientRenderFallbackOnTextMismatch = gate(

269 - flags => flags.enableClientRenderFallbackOnTextMismatch,

270 - );

268 expect(() => {

269 ReactDOM.flushSync(() => {

270 ReactDOMClient.hydrateRoot(

@@ -281,25 +278,19 @@ describe('rendering React components at document', () => {

278 );

279 });

280 }).toErrorDev(

284 - enableClientRenderFallbackOnTextMismatch

285 - ? [

286 - 'Warning: An error occurred during hydration. The server HTML was replaced with client content in <#document>.',

287 - 'Warning: Text content did not match.',

288 - ]

289 - : ['Warning: Text content did not match.'],

281 + [

282 + 'Warning: An error occurred during hydration. The server HTML was replaced with client content in <#document>.',

283 + 'Warning: Text content did not match.',

284 + ],

285 {

291 - withoutStack: enableClientRenderFallbackOnTextMismatch ? 1 : 0,

286 + withoutStack: 1,

287 },

288 );

289

295 - assertLog(

296 - enableClientRenderFallbackOnTextMismatch

297 - ? [

298 - 'Log recoverable error: Text content does not match server-rendered HTML.',

299 - '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.',

300 - ]

301 - : [],

302 - );

290 + assertLog([

291 + 'Log recoverable error: Text content does not match server-rendered HTML.',

292 + '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.',

293 + ]);

294 expect(testDocument.body.innerHTML).toBe('Hello world');

295 });

296

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

+15 -34

@@ -123,9 +123,6 @@ describe('ReactDOMServerHydration', () => {

123 // Now simulate a situation where the app is not idempotent. React should

124 // warn but do the right thing.

125 element.innerHTML = lastMarkup;

126 - const enableClientRenderFallbackOnTextMismatch = gate(

127 - flags => flags.enableClientRenderFallbackOnTextMismatch,

128 - );

126 await expect(async () => {

127 root = await act(() => {

128 return ReactDOMClient.hydrateRoot(

@@ -142,13 +139,11 @@ describe('ReactDOMServerHydration', () => {

139 );

140 });

141 }).toErrorDev(

145 - enableClientRenderFallbackOnTextMismatch

146 - ? [

147 - 'An error occurred during hydration. The server HTML was replaced with client content in <div>.',

148 - 'Text content did not match. Server: "x" Client: "y"',

149 - ]

150 - : ['Text content did not match. Server: "x" Client: "y"'],

151 - {withoutStack: enableClientRenderFallbackOnTextMismatch ? 1 : 0},

142 + [

143 + 'An error occurred during hydration. The server HTML was replaced with client content in <div>.',

144 + 'Text content did not match. Server: "x" Client: "y"',

145 + ],

146 + {withoutStack: 1},

147 );

148 expect(mountCount).toEqual(4);

149 expect(element.innerHTML.length > 0).toBe(true);

@@ -218,9 +213,6 @@ describe('ReactDOMServerHydration', () => {

213 const onFocusAfterHydration = jest.fn();

214 element.firstChild.focus = onFocusBeforeHydration;

215

221 - const enableClientRenderFallbackOnTextMismatch = gate(

222 - flags => flags.enableClientRenderFallbackOnTextMismatch,

223 - );

216 await expect(async () => {

217 await act(() => {

218 ReactDOMClient.hydrateRoot(

@@ -232,15 +224,11 @@ describe('ReactDOMServerHydration', () => {

224 );

225 });

226 }).toErrorDev(

235 - enableClientRenderFallbackOnTextMismatch

236 - ? [

237 - 'An error occurred during hydration. The server HTML was replaced with client content in <div>.',

238 - 'Warning: Text content did not match. Server: "server" Client: "client"',

239 - ]

240 - : [

241 - 'Warning: Text content did not match. Server: "server" Client: "client"',

242 - ],

243 - {withoutStack: enableClientRenderFallbackOnTextMismatch ? 1 : 0},

227 + [

228 + 'An error occurred during hydration. The server HTML was replaced with client content in <div>.',

229 + 'Warning: Text content did not match. Server: "server" Client: "client"',

230 + ],

231 + {withoutStack: 1},

232 );

233

234 expect(onFocusBeforeHydration).not.toHaveBeenCalled();

@@ -530,9 +518,6 @@ describe('ReactDOMServerHydration', () => {

518 );

519 domElement.innerHTML = markup;

520

533 - const enableClientRenderFallbackOnTextMismatch = gate(

534 - flags => flags.enableClientRenderFallbackOnTextMismatch,

535 - );

521 await expect(async () => {

522 await act(() => {

523 ReactDOMClient.hydrateRoot(

@@ -546,15 +531,11 @@ describe('ReactDOMServerHydration', () => {

531

532 expect(domElement.innerHTML).not.toEqual(markup);

533 }).toErrorDev(

549 - enableClientRenderFallbackOnTextMismatch

550 - ? [

551 - 'An error occurred during hydration. The server HTML was replaced with client content in <div>.',

552 - 'Warning: Text content did not match. Server: "server" Client: "client"',

553 - ]

554 - : [

555 - 'Warning: Text content did not match. Server: "server" Client: "client"',

556 - ],

557 - {withoutStack: enableClientRenderFallbackOnTextMismatch ? 1 : 0},

534 + [

535 + 'An error occurred during hydration. The server HTML was replaced with client content in <div>.',

536 + 'Warning: Text content did not match. Server: "server" Client: "client"',

537 + ],

538 + {withoutStack: 1},

539 );

540 });

541

packages/react-reconciler/src/ReactFiberCompleteWork.js

+1 -3

@@ -1306,9 +1306,7 @@ function completeWork(

1306 const currentHostContext = getHostContext();

1307 const wasHydrated = popHydrationState(workInProgress);

1308 if (wasHydrated) {

1309 - if (prepareToHydrateHostTextInstance(workInProgress)) {

1310 - markUpdate(workInProgress);

1311 - }

1309 + prepareToHydrateHostTextInstance(workInProgress);

1310 } else {

1311 workInProgress.stateNode = createTextInstance(

1312 newText,

packages/react-reconciler/src/ReactFiberHydrationContext.js

+3 -15

@@ -27,7 +27,6 @@ import {

27 HostRoot,

28 SuspenseComponent,

29 } from './ReactWorkTags';

30 -import {enableClientRenderFallbackOnTextMismatch} from 'shared/ReactFeatureFlags';

31 import {createFiberFromDehydratedFragment} from './ReactFiber';

32 import {

@@ -489,7 +488,7 @@ function prepareToHydrateHostInstance(

488 );

489 }

490

492 -function prepareToHydrateHostTextInstance(fiber: Fiber): boolean {

491 +function prepareToHydrateHostTextInstance(fiber: Fiber): void {

492 if (!supportsHydration) {

493 throw new Error(

494 'Expected prepareToHydrateHostTextInstance() to never be called. ' +

@@ -500,13 +499,13 @@ function prepareToHydrateHostTextInstance(fiber: Fiber): boolean {

499 const textInstance: TextInstance = fiber.stateNode;

500 const textContent: string = fiber.memoizedProps;

501 const shouldWarnIfMismatchDev = !didSuspendOrErrorDEV;

503 - const shouldUpdate = hydrateTextInstance(

502 + const textIsDifferent = hydrateTextInstance(

503 textInstance,

504 textContent,

505 fiber,

506 shouldWarnIfMismatchDev,

507 );

509 - if (shouldUpdate) {

508 + if (textIsDifferent) {

509 // We assume that prepareToHydrateHostTextInstance is called in a context where the

510 // hydration parent is the parent host component of this host text.

511 const returnFiber = hydrationParentFiber;

@@ -520,11 +519,6 @@ function prepareToHydrateHostTextInstance(fiber: Fiber): boolean {

519 textContent,

520 shouldWarnIfMismatchDev,

521 );

523 - if (enableClientRenderFallbackOnTextMismatch) {

524 - // In concurrent mode we never update the mismatched text,

525 - // even if the error was ignored.

526 - return false;

527 - }

522 break;

523 }

524 case HostSingleton:

@@ -540,17 +534,11 @@ function prepareToHydrateHostTextInstance(fiber: Fiber): boolean {

534 textContent,

535 shouldWarnIfMismatchDev,

536 );

543 - if (enableClientRenderFallbackOnTextMismatch) {

544 - // In concurrent mode we never update the mismatched text,

545 - // even if the error was ignored.

546 - return false;

547 - }

537 break;

538 }

539 }

540 }

541 }

553 - return shouldUpdate;

542 }

543

544 function prepareToHydrateHostSuspenseInstance(fiber: Fiber): void {

packages/shared/ReactFeatureFlags.js

-1

@@ -30,7 +30,6 @@ export const enableComponentStackLocations = true;

30 // -----------------------------------------------------------------------------