remove the concept of itemScope and categorically treat itemProp as an opt out

Author: gnoff

packages/react-dom-bindings/src/client/ReactDOMComponent.js

@@ -7,8 +7,6 @@
  * @flow
  */
 
-import type {ExoticNamespace} from '../shared/DOMNamespaces';
-
 import {
   registrationNameDependencies,
   possibleRegistrationNames,
@@ -57,7 +55,12 @@ import {
   setValueForStyles,
   validateShorthandPropertyCollisionInDev,
 } from './CSSPropertyOperations';
-import {HTML_NAMESPACE} from '../shared/DOMNamespaces';
+import {
+  HTML_NAMESPACE,
+  MATH_NAMESPACE,
+  SVG_NAMESPACE,
+  getIntrinsicNamespace,
+} from '../shared/DOMNamespaces';
 import {
   getPropertyInfo,
   shouldIgnoreAttribute,
@@ -381,14 +384,10 @@ function updateDOMProperties(
 export function createHTMLElement(
   type: string,
   props: Object,
-  rootContainerElement: Element | Document | DocumentFragment,
+  ownerDocument: Document,
 ): Element {
   let isCustomComponentTag;
 
-  // We create tags in the namespace of their parent container, except HTML
-  // tags get no namespace.
-  const ownerDocument: Document =
-    getOwnerDocumentFromRootContainer(rootContainerElement);
   let domElement: Element;
   if (__DEV__) {
     isCustomComponentTag = isCustomComponent(type, props);
@@ -473,17 +472,18 @@ export function createHTMLElement(
   return domElement;
 }
 
-// Creates elements in the HTML either SVG or Math namespace
-export function createElementNS(
-  namespaceURI: ExoticNamespace,
+export function createSVGElement(
   type: string,
-  rootContainerElement: Element | Document | DocumentFragment,
+  ownerDocument: Document,
 ): Element {
-  // This
-  const ownerDocument: Document =
-    getOwnerDocumentFromRootContainer(rootContainerElement);
+  return ownerDocument.createElementNS(SVG_NAMESPACE, type);
+}
 
-  return ownerDocument.createElementNS(namespaceURI, type);
+export function createMathElement(
+  type: string,
+  ownerDocument: Document,
+): Element {
+  return ownerDocument.createElementNS(MATH_NAMESPACE, type);
 }
 
 export function createTextNode(
@@ -871,7 +871,7 @@ export function diffHydratedProperties(
   rawProps: Object,
   isConcurrentMode: boolean,
   shouldWarnDev: boolean,
-  namespaceDEV?: string,
+  parentNamespaceDev: string,
 ): null | Array<mixed> {
   let isCustomComponentTag;
   let extraAttributeNames: Set<string>;
@@ -1114,7 +1114,11 @@ export function diffHydratedProperties(
             propertyInfo,
           );
         } else {
-          if (namespaceDEV === HTML_NAMESPACE) {
+          let ownNamespaceDev = parentNamespaceDev;
+          if (ownNamespaceDev === HTML_NAMESPACE) {
+            ownNamespaceDev = getIntrinsicNamespace(tag);
+          }
+          if (ownNamespaceDev === HTML_NAMESPACE) {
             // $FlowFixMe - Should be inferred as not undefined.
             extraAttributeNames.delete(propKey.toLowerCase());
           } else {

packages/react-dom-bindings/src/client/ReactDOMFloatClient.js

@@ -9,30 +9,32 @@
 
 import type {Instance, Container} from './ReactDOMHostConfig';
 
-import {isAttributeNameSafe} from '../shared/DOMProperty';
-import {precacheFiberNode} from './ReactDOMComponentTree';
+import {getCurrentRootHostContainer} from 'react-reconciler/src/ReactFiberHostContext';
 
 import ReactDOMSharedInternals from 'shared/ReactDOMSharedInternals.js';
 const {Dispatcher} = ReactDOMSharedInternals;
+import {
+  checkAttributeStringCoercion,
+  checkPropStringCoercion,
+} from 'shared/CheckStringCoercion';
+
 import {DOCUMENT_NODE} from '../shared/HTMLNodeType';
+import {isAttributeNameSafe} from '../shared/DOMProperty';
+import {SVG_NAMESPACE} from '../shared/DOMNamespaces';
 import {
   validatePreloadArguments,
   validatePreinitArguments,
   getValueDescriptorExpectingObjectForWarning,
   getValueDescriptorExpectingEnumForWarning,
 } from '../shared/ReactDOMResourceValidation';
+
+import {precacheFiberNode} from './ReactDOMComponentTree';
 import {createHTMLElement, setInitialProperties} from './ReactDOMComponent';
-import {
-  checkAttributeStringCoercion,
-  checkPropStringCoercion,
-} from 'shared/CheckStringCoercion';
 import {
   getResourcesFromRoot,
   isMarkedResource,
   markNodeAsResource,
 } from './ReactDOMComponentTree';
-import {SVG_NAMESPACE} from '../shared/DOMNamespaces';
-import {getCurrentRootHostContainer} from 'react-reconciler/src/ReactFiberHostContext';
 
 // The resource types we support. currently they match the form for the as argument.
 // In the future this may need to change, especially when modules / scripts are supported
@@ -414,7 +416,8 @@ function preinit(href: string, options: PreinitOptions) {
           if (preloadProps) {
             adoptPreloadPropsForStylesheet(stylesheetProps, preloadProps);
           }
-          instance = createHTMLElement('link', stylesheetProps, resourceRoot);
+          const ownerDocument = getDocumentFromRoot(resourceRoot);
+          instance = createHTMLElement('link', stylesheetProps, ownerDocument);
           markNodeAsResource(instance);
           setInitialProperties(instance, 'link', stylesheetProps);
           insertStylesheet(instance, precedence, resourceRoot);
@@ -455,7 +458,8 @@ function preinit(href: string, options: PreinitOptions) {
           if (preloadProps) {
             adoptPreloadPropsForScript(scriptProps, preloadProps);
           }
-          instance = createHTMLElement('script', scriptProps, resourceRoot);
+          const ownerDocument = getDocumentFromRoot(resourceRoot);
+          instance = createHTMLElement('script', scriptProps, ownerDocument);
           markNodeAsResource(instance);
           setInitialProperties(instance, 'link', scriptProps);
           (getDocumentFromRoot(resourceRoot).head: any).appendChild(instance);
@@ -753,7 +757,8 @@ export function acquireResource(
         }
 
         const styleProps = styleTagPropsFromRawProps(props);
-        instance = createHTMLElement('style', styleProps, hoistableRoot);
+        const ownerDocument = getDocumentFromRoot(hoistableRoot);
+        instance = createHTMLElement('style', styleProps, ownerDocument);
 
         markNodeAsResource(instance);
         setInitialProperties(instance, 'style', styleProps);
@@ -786,7 +791,8 @@ export function acquireResource(
         }
 
         // Construct and insert a new instance
-        instance = createHTMLElement('link', stylesheetProps, hoistableRoot);
+        const ownerDocument = getDocumentFromRoot(hoistableRoot);
+        instance = createHTMLElement('link', stylesheetProps, ownerDocument);
         markNodeAsResource(instance);
         const linkInstance: HTMLLinkElement = (instance: any);
         (linkInstance: any)._p = new Promise((resolve, reject) => {
@@ -827,7 +833,8 @@ export function acquireResource(
         }
 
         // Construct and insert a new instance
-        instance = createHTMLElement('script', scriptProps, hoistableRoot);
+        const ownerDocument = getDocumentFromRoot(hoistableRoot);
+        instance = createHTMLElement('script', scriptProps, ownerDocument);
         markNodeAsResource(instance);
         setInitialProperties(instance, 'link', scriptProps);
         (getDocumentFromRoot(hoistableRoot).head: any).appendChild(instance);