Revert "Emit reactroot attribute on the first element we discover (#2…

…1154)" (#21340) This reverts commit 266c26a.
facebook · Apr 23, 2021 · ad09175 · ad09175
1 parent 709f948
commit ad09175
Show file tree

Hide file tree

Showing 5 changed files with 8 additions and 43 deletions.
diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
@@ -117,10 +117,6 @@ describe('ReactDOMFizzServer', () => {
               // We assume this is a React added ID that's a non-visual implementation detail.
               continue;
             }
-            if (attributes[i].name === 'data-reactroot') {
-              // We ignore React injected attributes.
-              continue;
-            }
             props[attributes[i].name] = attributes[i].value;
           }
           props.children = getVisibleChildren(node);

diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServerBrowser-test.js
@@ -55,9 +55,7 @@ describe('ReactDOMFizzServer', () => {
       <div>hello world</div>,
     );
     const result = await readResult(stream);
-    expect(result).toMatchInlineSnapshot(
-      `"<div data-reactroot=\\"\\">hello world</div>"`,
-    );
+    expect(result).toMatchInlineSnapshot(`"<div>hello world</div>"`);
   });
 
   // @gate experimental
@@ -96,7 +94,7 @@ describe('ReactDOMFizzServer', () => {
 
     const result = await readResult(stream);
     expect(result).toMatchInlineSnapshot(
-      `"<div data-reactroot=\\"\\"><!--$-->Done<!-- --><!--/$--></div>"`,
+      `"<div><!--$-->Done<!-- --><!--/$--></div>"`,
     );
   });
 

diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServerNode-test.js
@@ -65,9 +65,7 @@ describe('ReactDOMFizzServer', () => {
     );
     startWriting();
     jest.runAllTimers();
-    expect(output.result).toMatchInlineSnapshot(
-      `"<div data-reactroot=\\"\\">hello world</div>"`,
-    );
+    expect(output.result).toMatchInlineSnapshot(`"<div>hello world</div>"`);
   });
 
   // @gate experimental
@@ -84,7 +82,7 @@ describe('ReactDOMFizzServer', () => {
     // Then React starts writing.
     startWriting();
     expect(output.result).toMatchInlineSnapshot(
-      `"<!doctype html><html><head><title>test</title><head><body><div data-reactroot=\\"\\">hello world</div>"`,
+      `"<!doctype html><html><head><title>test</title><head><body><div>hello world</div>"`,
     );
   });
 
@@ -132,7 +130,7 @@ describe('ReactDOMFizzServer', () => {
     // Then React starts writing.
     startWriting();
     expect(output.result).toMatchInlineSnapshot(
-      `"<!doctype html><html><head><title>test</title><head><body><div data-reactroot=\\"\\"><!--$-->Done<!-- --><!--/$--></div>"`,
+      `"<!doctype html><html><head><title>test</title><head><body><div><!--$-->Done<!-- --><!--/$--></div>"`,
     );
   });
 

diff --git a/packages/react-dom/src/server/ReactDOMServerFormatConfig.js b/packages/react-dom/src/server/ReactDOMServerFormatConfig.js
@@ -32,7 +32,6 @@ import {
   OVERLOADED_BOOLEAN,
   NUMERIC,
   POSITIVE_NUMERIC,
-  ROOT_ATTRIBUTE_NAME,
 } from '../shared/DOMProperty';
 import {isUnitlessNumber} from '../shared/CSSProperty';
 
@@ -64,7 +63,6 @@ export type ResponseState = {
   sentCompleteSegmentFunction: boolean,
   sentCompleteBoundaryFunction: boolean,
   sentClientRenderFunction: boolean,
-  hasEmittedRoot: boolean,
 };
 
 // Allows us to keep track of what we've already written so we can refer back to it.
@@ -81,7 +79,6 @@ export function createResponseState(
     sentCompleteSegmentFunction: false,
     sentCompleteBoundaryFunction: false,
     sentClientRenderFunction: false,
-    hasEmittedRoot: false,
   };
 }
 
@@ -102,7 +99,7 @@ type InsertionMode = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7;
 
 // Lets us keep track of contextual state and pick it back up after suspending.
 export type FormatContext = {
-  insertionMode: InsertionMode, // svg/html/mathml/table
+  insertionMode: InsertionMode, // root/svg/html/mathml/table
   selectedValue: null | string | Array<string>, // the selected value(s) inside a <select>, or null outside <select>
 };
 
@@ -511,19 +508,6 @@ const endOfStartTagSelfClosing = stringToPrecomputedChunk('/>');
 const idAttr = stringToPrecomputedChunk(' id="');
 const attrEnd = stringToPrecomputedChunk('"');
 
-const reactRootAttribute = stringToPrecomputedChunk(
-  ' ' + ROOT_ATTRIBUTE_NAME + '=""',
-);
-function pushReactRoot(
-  target: Array<Chunk | PrecomputedChunk>,
-  responseState: ResponseState,
-): void {
-  if (!responseState.hasEmittedRoot) {
-    responseState.hasEmittedRoot = true;
-    target.push(reactRootAttribute);
-  }
-}
-
 function pushID(
   target: Array<Chunk | PrecomputedChunk>,
   responseState: ResponseState,
@@ -657,7 +641,6 @@ function pushStartSelect(
   if (assignID !== null) {
     pushID(target, responseState, assignID, props.id);
   }
-  pushReactRoot(target, responseState);
 
   target.push(endOfStartTag);
   pushInnerHTML(target, innerHTML, children);
@@ -772,7 +755,6 @@ function pushStartOption(
   if (assignID !== null) {
     pushID(target, responseState, assignID, props.id);
   }
-  pushReactRoot(target, responseState);
 
   target.push(endOfStartTag);
   return children;
@@ -860,7 +842,6 @@ function pushInput(
   if (assignID !== null) {
     pushID(target, responseState, assignID, props.id);
   }
-  pushReactRoot(target, responseState);
 
   target.push(endOfStartTagSelfClosing);
   return null;
@@ -925,7 +906,6 @@ function pushStartTextArea(
   if (assignID !== null) {
     pushID(target, responseState, assignID, props.id);
   }
-  pushReactRoot(target, responseState);
 
   target.push(endOfStartTag);
 
@@ -1002,7 +982,6 @@ function pushSelfClosing(
   if (assignID !== null) {
     pushID(target, responseState, assignID, props.id);
   }
-  pushReactRoot(target, responseState);
 
   target.push(endOfStartTagSelfClosing);
   return null;
@@ -1039,7 +1018,6 @@ function pushStartMenuItem(
   if (assignID !== null) {
     pushID(target, responseState, assignID, props.id);
   }
-  pushReactRoot(target, responseState);
 
   target.push(endOfStartTag);
   return null;
@@ -1078,7 +1056,6 @@ function pushStartGenericElement(
   if (assignID !== null) {
     pushID(target, responseState, assignID, props.id);
   }
-  pushReactRoot(target, responseState);
 
   target.push(endOfStartTag);
   pushInnerHTML(target, innerHTML, children);
@@ -1143,7 +1120,6 @@ function pushStartCustomElement(
   if (assignID !== null) {
     pushID(target, responseState, assignID, props.id);
   }
-  pushReactRoot(target, responseState);
 
   target.push(endOfStartTag);
   pushInnerHTML(target, innerHTML, children);
@@ -1185,7 +1161,6 @@ function pushStartPreformattedElement(
   if (assignID !== null) {
     pushID(target, responseState, assignID, props.id);
   }
-  pushReactRoot(target, responseState);
 
   target.push(endOfStartTag);
 

diff --git a/packages/react-server-dom-relay/src/__tests__/ReactDOMServerFB-test.internal.js b/packages/react-server-dom-relay/src/__tests__/ReactDOMServerFB-test.internal.js
@@ -45,9 +45,7 @@ describe('ReactDOMServerFB', () => {
       },
     });
     const result = readResult(stream);
-    expect(result).toMatchInlineSnapshot(
-      `"<div data-reactroot=\\"\\">hello world</div>"`,
-    );
+    expect(result).toMatchInlineSnapshot(`"<div>hello world</div>"`);
   });
 
   it('emits all HTML as one unit if we wait until the end to start', async () => {
@@ -81,7 +79,7 @@ describe('ReactDOMServerFB', () => {
 
     const result = readResult(stream);
     expect(result).toMatchInlineSnapshot(
-      `"<div data-reactroot=\\"\\"><!--$-->Done<!-- --><!--/$--></div>"`,
+      `"<div><!--$-->Done<!-- --><!--/$--></div>"`,
     );
   });