Validate content sent into InPortal to ensure it matches elementType

Author: spautz

src/index.tsx

@@ -133,11 +133,32 @@ class InPortal extends React.PureComponent<InPortalProps, { nodeProps: {} }> {
         });
     };
 
+    validateElementTypesOfChildren() {
+        const {
+            elementType,
+            element: { childNodes },
+        } = this.props.node;
+
+        // To support SVG and other non-html elements, every element that gets rendered
+        // into the InPortal needs to match the portalNode's elementType.
+        // Non-elements like text and comments are fine with any portal type.
+        childNodes.forEach((childNode) => {
+            if (childNode instanceof Element) {
+                if ((elementType === ELEMENT_TYPE_HTML && !(childNode instanceof HTMLElement)) ||
+                    (elementType === ELEMENT_TYPE_SVG  && !(childNode instanceof SVGElement))) {
+                    throw new Error(`Invalid content for portal: "${elementType}" portalNodes must be used with ${elementType} elements, but InPortal received <${childNode.tagName}>.`);
+                }
+            }
+        })
+    }
+
     componentDidMount() {
+        this.validateElementTypesOfChildren();
         this.addPropsChannel();
     }
 
     componentDidUpdate() {
+        this.validateElementTypesOfChildren();
         this.addPropsChannel();
     }