ReactDOM.createRoot

Introduce new API for creating roots. Only root.render and root.unmount
are implemented. Later we'll add root.prerender, and support for lazy
roots (roots with DOM containers that resolve lazily).

src/renderers/dom/fiber/ReactDOMFiberEntry.js

@@ -757,7 +757,39 @@ function createPortal(
   return ReactPortal.createPortal(children, container, null, key);
 }
 
+type ReactRootNode = {
+  render(children: ReactNodeList, callback: ?() => mixed): void,
+  unmount(callback: ?() => mixed): void,
+
+  _reactRootContainer: *,
+};
+
+type RootOptions = {
+  hydrate?: boolean,
+};
+
+function ReactRoot(container: Container, hydrate: boolean) {
+  const root = DOMRenderer.createContainer(container);
+  this._reactRootContainer = root;
+}
+ReactRoot.prototype.render = function(
+  children: ReactNodeList,
+  callback: ?() => mixed,
+): void {
+  const root = this._reactRootContainer;
+  DOMRenderer.updateContainer(children, root, null, callback);
+};
+ReactRoot.prototype.unmount = function(callback) {
+  const root = this._reactRootContainer;
+  DOMRenderer.updateContainer(null, root, null, callback);
+};
+
 var ReactDOMFiber = {
+  createRoot(container: DOMContainer, options?: RootOptions): ReactRootNode {
+    const hydrate = options != null && options.hydrate === true;
+    return new ReactRoot(container, hydrate);
+  },
+
   createPortal,
 
   findDOMNode(

src/renderers/dom/shared/__tests__/ReactDOMRoot-test.js

@@ -0,0 +1,35 @@
+/**
+ * Copyright (c) 2013-present, Facebook, Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @emails react-core
+ */
+
+'use strict';
+
+var React = require('react');
+var ReactDOM = require('react-dom');
+
+describe('ReactDOMRoot', () => {
+  let container;
+
+  beforeEach(() => {
+    container = document.createElement('div');
+  });
+
+  it('renders children', () => {
+    const root = ReactDOM.createRoot(container);
+    root.render(<div>Hi</div>);
+    expect(container.textContent).toEqual('Hi');
+  });
+
+  it('unmounts children', () => {
+    const root = ReactDOM.createRoot(container);
+    root.render(<div>Hi</div>);
+    expect(container.textContent).toEqual('Hi');
+    root.unmount();
+    expect(container.textContent).toEqual('');
+  });
+});