Read ownerDocument from the root container instance

This way createInstance() depends on the innermost container only for reading the namespace.

Author: gaearon

src/renderers/dom/fiber/ReactDOMFiber.js

@@ -81,10 +81,11 @@ var DOMRenderer = ReactFiberReconciler({
   createInstance(
     type : string,
     props : Props,
+    rootContainerInstance : Container,
     containerInstance : Instance | Container,
     internalInstanceHandle : Object,
   ) : Instance {
-    const domElement : Instance = createElement(type, props, containerInstance);
+    const domElement : Instance = createElement(type, props, rootContainerInstance, containerInstance);
     precacheFiberNode(internalInstanceHandle, domElement);
     return domElement;
   },

src/renderers/dom/fiber/ReactDOMFiberComponent.js

@@ -467,19 +467,20 @@ var ReactDOMFiberComponent = {
   createElement(
     type : string,
     props : Object,
-    rootContainerElement : Element
+    rootContainerElement : Element,
+    containerElement : Element
   ) : Element {
     validateDangerousTag(type);
     // TODO:
     // const tag = type.toLowerCase(); Do we need to apply lower case only on non-custom elements?
 
     // We create tags in the namespace of their parent container, except HTML
     // tags get no namespace.
-    var namespaceURI = rootContainerElement.namespaceURI;
+    var namespaceURI = containerElement.namespaceURI;
     if (namespaceURI == null ||
         namespaceURI === DOMNamespaces.svg &&
         // We don't need convert to lowercase because SVG is case sensitive:
-        rootContainerElement.tagName === 'foreignObject') {
+        containerElement.tagName === 'foreignObject') {
       namespaceURI = DOMNamespaces.html;
     }
     if (namespaceURI === DOMNamespaces.html) {

src/renderers/shared/fiber/ReactFiberBeginWork.js

@@ -72,6 +72,7 @@ module.exports = function<T, P, I, TI, C>(
 
   const {
     getHostContainerOnStack,
+    getRootHostContainerOnStack,
     pushHostContainer,
     saveHostContextToPortal,
   } = hostContext;
@@ -234,8 +235,18 @@ module.exports = function<T, P, I, TI, C>(
     }
     if (!current && workInProgress.stateNode == null) {
       const newProps = workInProgress.pendingProps;
-      const hostContainer = getHostContainerOnStack();
-      const instance = createInstance(workInProgress.type, newProps, hostContainer, workInProgress);
+      const containerInstance = getHostContainerOnStack();
+      const rootContainerInstance = getRootHostContainerOnStack();
+      if (rootContainerInstance == null) {
+        throw new Error('Expected to find a root instance on the host stack.');
+      }
+      const instance = createInstance(
+        workInProgress.type,
+        newProps,
+        rootContainerInstance,
+        containerInstance,
+        workInProgress
+      );
       workInProgress.stateNode = instance;
     }
     if (workInProgress.pendingProps.hidden &&

src/renderers/shared/fiber/ReactFiberReconciler.js

@@ -44,7 +44,7 @@ export type HostConfig<T, P, I, TI, C> = {
 
   isContainerType(type : T) : boolean,
 
-  createInstance(type : T, props : P, containerInstance : I | C, internalInstanceHandle : OpaqueNode) : I,
+  createInstance(type : T, props : P, rootContainerInstance : C, containerInstance : I | C, internalInstanceHandle : OpaqueNode) : I,
   appendInitialChild(parentInstance : I, child : I | TI) : void,
   finalizeInitialChildren(parentInstance : I, props : P, rootContainerInstance : C) : void,