Change in behavior is gated behind enableClientRenderFallbackOnTextMi…

…smatch
facebook · Jan 28, 2024 · 1b4b4dc · 1b4b4dc
1 parent 4312b1f
commit 1b4b4dc
Showing 1 changed file with 16 additions and 5 deletions.
diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationElements-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationElements-test.js
@@ -18,6 +18,7 @@ let React;
 let ReactDOM;
 let ReactDOMClient;
 let ReactDOMServer;
+let ReactFeatureFlags;
 let ReactTestUtils;
 
 function initModules() {
@@ -26,6 +27,7 @@ function initModules() {
   ReactDOM = require('react-dom');
   ReactDOMClient = require('react-dom/client');
   ReactDOMServer = require('react-dom/server');
+  ReactFeatureFlags = require('shared/ReactFeatureFlags');
   ReactTestUtils = require('react-dom/test-utils');
 
   // Make them available to the helpers.
@@ -844,15 +846,16 @@ describe('ReactDOMServerIntegration', () => {
           if (
             render === serverRender ||
             render === streamRender ||
-            render === clientRenderOnServerString
+            (render === clientRenderOnServerString &&
+              ReactFeatureFlags.enableClientRenderFallbackOnTextMismatch)
           ) {
             expect(e.childNodes.length).toBe(1);
-            // Everything becomes LF when parsed from server HTML or hydrated.
+            // Everything becomes LF when parsed from server HTML or hydrated if enableClientRenderFallbackOnTextMismatch is on.
             // Null character is ignored.
             expectNode(e.childNodes[0], TEXT_NODE_TYPE, 'foo\nbar\nbaz\nqux');
           } else {
             expect(e.childNodes.length).toBe(1);
-            // Client rendering uses JS value with CR.
+            // Client rendering (or hydration without enableClientRenderFallbackOnTextMismatch) uses JS value with CR.
             // Null character stays.
 
             expectNode(
@@ -876,14 +879,22 @@ describe('ReactDOMServerIntegration', () => {
           if (
             render === serverRender ||
             render === streamRender ||
-            render === clientRenderOnServerString
+            (render === clientRenderOnServerString &&
+              ReactFeatureFlags.enableClientRenderFallbackOnTextMismatch)
           ) {
             // We have three nodes because there is a comment between them.
             expect(e.childNodes.length).toBe(3);
-            // Everything becomes LF when parsed from server HTML or hydrated.
+            // Everything becomes LF when parsed from server HTML or hydrated if enableClientRenderFallbackOnTextMismatch is on.
             // Null character is ignored.
             expectNode(e.childNodes[0], TEXT_NODE_TYPE, 'foo\nbar');
             expectNode(e.childNodes[2], TEXT_NODE_TYPE, '\nbaz\nqux');
+          } else if (render === clientRenderOnServerString) {
+            // We have three nodes because there is a comment between them.
+            expect(e.childNodes.length).toBe(3);
+            // Hydration without enableClientRenderFallbackOnTextMismatch uses JS value with CR and null character.
+
+            expectNode(e.childNodes[0], TEXT_NODE_TYPE, 'foo\rbar');
+            expectNode(e.childNodes[2], TEXT_NODE_TYPE, '\r\nbaz\nqux\u0000');
           } else {
             expect(e.childNodes.length).toBe(2);
             // Client rendering uses JS value with CR and null character.