Move ReactDOMLegacy implementation into RootFB (facebook#28656)

Only the FB entry point has legacy mode now so we can move the remaining
code in there.

Also enable disableLegacyMode in modern www builds since it doesn't
expose those entry points.

Now dependent on facebook#28709.

---------

Co-authored-by: Josh Story <[email protected]>

Author: 2 people

packages/react-devtools-shell/src/app/index.js

@@ -69,6 +69,7 @@ function mountStrictApp(App) {
 }
 
 function mountLegacyApp(App: () => React$Node) {
+  // $FlowFixMe[prop-missing]: These are removed in 19.
   const {render, unmountComponentAtNode} = require('react-dom');
 
   function LegacyRender() {
@@ -77,8 +78,10 @@ function mountLegacyApp(App: () => React$Node) {
 
   const container = createContainer();
 
+  // $FlowFixMe[not-a-function]: These are removed in 19.
   render(createElement(LegacyRender), container);
 
+  // $FlowFixMe: These are removed in 19.
   unmountFunctions.push(() => unmountComponentAtNode(container));
 }
 

packages/react-devtools-shell/src/e2e-regression/app-legacy.js

@@ -15,6 +15,7 @@ function mountApp(App: () => React$Node) {
 
   ((document.body: any): HTMLBodyElement).appendChild(container);
 
+  // $FlowFixMe[prop-missing]: These are removed in 19.
   ReactDOM.render(<App />, container);
 }
 function mountTestApp() {

packages/react-dom/index.classic.fb.js

@@ -20,11 +20,8 @@ Object.assign((Internals: any), {
 
 export {
   createPortal,
-  findDOMNode,
   flushSync,
-  unmountComponentAtNode,
   unstable_createEventHandle,
-  unstable_renderSubtreeIntoContainer,
   unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
   useFormStatus,
   useFormState,
@@ -42,6 +39,9 @@ export {
   hydrateRoot,
   render,
   unstable_batchedUpdates,
+  findDOMNode,
+  unstable_renderSubtreeIntoContainer,
+  unmountComponentAtNode,
 } from './src/client/ReactDOMRootFB';
 
 export {Internals as __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED};

packages/react-dom/index.js

@@ -15,11 +15,8 @@ export {
   createRoot,
   hydrateRoot,
   flushSync,
-  render,
-  unmountComponentAtNode,
   unstable_batchedUpdates,
   unstable_createEventHandle,
-  unstable_renderSubtreeIntoContainer,
   unstable_runWithPriority, // DO NOT USE: Temporarily exposed to migrate off of Scheduler.runWithPriority.
   useFormStatus,
   useFormState,

packages/react-dom/index.stable.js

@@ -13,10 +13,7 @@ export {
   createRoot,
   hydrateRoot,
   flushSync,
-  render,
-  unmountComponentAtNode,
   unstable_batchedUpdates,
-  unstable_renderSubtreeIntoContainer,
   useFormStatus,
   useFormState,
   prefetchDNS,

packages/react-dom/src/ReactDOMSharedInternals.js

@@ -7,7 +7,6 @@
  * @flow
  */
 
-import type {FindDOMNodeType} from './client/ReactDOMLegacy.js';
 import type {HostDispatcher} from './shared/ReactDOMTypes';
 
 type InternalsType = {
@@ -16,7 +15,11 @@ type InternalsType = {
   ReactDOMCurrentDispatcher: {
     current: HostDispatcher,
   },
-  findDOMNode: null | FindDOMNodeType,
+  findDOMNode:
+    | null
+    | ((
+        componentOrElement: React$Component<any, any>,
+      ) => null | Element | Text),
 };
 
 function noop() {}

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

@@ -14,7 +14,6 @@ let act;
 let React;
 let ReactDOM;
 let ReactDOMClient;
-let findDOMNode;
 
 const clone = function (o) {
   return JSON.parse(JSON.stringify(o));
@@ -95,8 +94,6 @@ describe('ReactComponentLifeCycle', () => {
 
     React = require('react');
     ReactDOM = require('react-dom');
-    findDOMNode =
-      ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.findDOMNode;
     ReactDOMClient = require('react-dom/client');
   });
 
@@ -376,6 +373,7 @@ describe('ReactComponentLifeCycle', () => {
     expect(instance.updater.isMounted(instance)).toBe(false);
   });
 
+  // @gate www && !disableLegacyMode
   it('warns if legacy findDOMNode is used inside render', async () => {
     class Component extends React.Component {
       state = {isMounted: false};
@@ -384,7 +382,7 @@ describe('ReactComponentLifeCycle', () => {
       }
       render() {
         if (this.state.isMounted) {
-          expect(findDOMNode(this).tagName).toBe('DIV');
+          expect(ReactDOM.findDOMNode(this).tagName).toBe('DIV');
         }
         return <div />;
       }

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

@@ -103,9 +103,9 @@ describe('ReactDeprecationWarnings', () => {
         });
       }
     }
-    expect(() => {
-      ReactNoop.renderLegacySyncRoot(<Component />);
-    }).toErrorDev([
+
+    ReactNoop.render(<Component />);
+    await expect(async () => await waitForAll([])).toErrorDev([
       'Component "Component" contains the string ref "refComponent". Support for string refs will be removed in a future major release.',
     ]);
     await waitForAll([]);

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

@@ -586,6 +586,7 @@ describe('ReactTestUtils', () => {
   });
 
   // @gate !disableDOMTestUtils
+  // @gate !disableLegacyMode
   it('should call setState callback with no arguments', async () => {
     let mockArgs;
     class Component extends React.Component {

packages/react-dom/src/__tests__/findDOMNode-test.js renamed to packages/react-dom/src/__tests__/findDOMNodeFB-test.js

@@ -11,16 +11,15 @@
 
 const React = require('react');
 const ReactDOM = require('react-dom');
-const findDOMNode =
-  ReactDOM.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.findDOMNode;
 const StrictMode = React.StrictMode;
 
 describe('findDOMNode', () => {
+  // @gate www && !disableLegacyMode
   it('findDOMNode should return null if passed null', () => {
-    expect(findDOMNode(null)).toBe(null);
+    expect(ReactDOM.findDOMNode(null)).toBe(null);
   });
 
-  // @gate !disableLegacyMode
+  // @gate www && !disableLegacyMode
   it('findDOMNode should find dom element', () => {
     class MyNode extends React.Component {
       render() {
@@ -34,13 +33,13 @@ describe('findDOMNode', () => {
 
     const container = document.createElement('div');
     const myNode = ReactDOM.render(<MyNode />, container);
-    const myDiv = findDOMNode(myNode);
-    const mySameDiv = findDOMNode(myDiv);
+    const myDiv = ReactDOM.findDOMNode(myNode);
+    const mySameDiv = ReactDOM.findDOMNode(myDiv);
     expect(myDiv.tagName).toBe('DIV');
     expect(mySameDiv).toBe(myDiv);
   });
 
-  // @gate !disableLegacyMode
+  // @gate www && !disableLegacyMode
   it('findDOMNode should find dom element after an update from null', () => {
     function Bar({flag}) {
       if (flag) {
@@ -57,23 +56,24 @@ describe('findDOMNode', () => {
     const container = document.createElement('div');
 
     const myNodeA = ReactDOM.render(<MyNode />, container);
-    const a = findDOMNode(myNodeA);
+    const a = ReactDOM.findDOMNode(myNodeA);
     expect(a).toBe(null);
 
     const myNodeB = ReactDOM.render(<MyNode flag={true} />, container);
     expect(myNodeA === myNodeB).toBe(true);
 
-    const b = findDOMNode(myNodeB);
+    const b = ReactDOM.findDOMNode(myNodeB);
     expect(b.tagName).toBe('SPAN');
   });
 
+  // @gate www && !disableLegacyMode
   it('findDOMNode should reject random objects', () => {
     expect(function () {
-      findDOMNode({foo: 'bar'});
+      ReactDOM.findDOMNode({foo: 'bar'});
     }).toThrowError('Argument appears to not be a ReactComponent. Keys: foo');
   });
 
-  // @gate !disableLegacyMode
+  // @gate www && !disableLegacyMode
   it('findDOMNode should reject unmounted objects with render func', () => {
     class Foo extends React.Component {
       render() {
@@ -85,16 +85,16 @@ describe('findDOMNode', () => {
     const inst = ReactDOM.render(<Foo />, container);
     ReactDOM.unmountComponentAtNode(container);
 
-    expect(() => findDOMNode(inst)).toThrowError(
+    expect(() => ReactDOM.findDOMNode(inst)).toThrowError(
       'Unable to find node on an unmounted component.',
     );
   });
 
-  // @gate !disableLegacyMode
+  // @gate www && !disableLegacyMode
   it('findDOMNode should not throw an error when called within a component that is not mounted', () => {
     class Bar extends React.Component {
       UNSAFE_componentWillMount() {
-        expect(findDOMNode(this)).toBeNull();
+        expect(ReactDOM.findDOMNode(this)).toBeNull();
       }
 
       render() {
@@ -107,7 +107,7 @@ describe('findDOMNode', () => {
     }).not.toThrow();
   });
 
-  // @gate !disableLegacyMode
+  // @gate www && !disableLegacyMode
   it('findDOMNode should warn if used to find a host component inside StrictMode', () => {
     let parent = undefined;
     let child = undefined;
@@ -129,7 +129,7 @@ describe('findDOMNode', () => {
     );
 
     let match;
-    expect(() => (match = findDOMNode(parent))).toErrorDev([
+    expect(() => (match = ReactDOM.findDOMNode(parent))).toErrorDev([
       'Warning: findDOMNode is deprecated in StrictMode. ' +
         'findDOMNode was passed an instance of ContainsStrictModeChild which renders StrictMode children. ' +
         'Instead, add a ref directly to the element you want to reference. ' +
@@ -141,7 +141,7 @@ describe('findDOMNode', () => {
     expect(match).toBe(child);
   });
 
-  // @gate !disableLegacyMode
+  // @gate www && !disableLegacyMode
   it('findDOMNode should warn if passed a component that is inside StrictMode', () => {
     let parent = undefined;
     let child = undefined;
@@ -162,7 +162,7 @@ describe('findDOMNode', () => {
     );
 
     let match;
-    expect(() => (match = findDOMNode(parent))).toErrorDev([
+    expect(() => (match = ReactDOM.findDOMNode(parent))).toErrorDev([
       'Warning: findDOMNode is deprecated in StrictMode. ' +
         'findDOMNode was passed an instance of IsInStrictMode which is inside StrictMode. ' +
         'Instead, add a ref directly to the element you want to reference. ' +