in this context (div > div).'
);
});
@@ -679,7 +680,8 @@ describe('ReactDOMComponent', function() {
expect(console.error.calls.length).toBe(1);
expect(console.error.calls[0].args[0]).toBe(
- 'Warning: validateDOMNesting(...):
cannot contain a
node.'
+ 'Warning: validateDOMNesting(...):
cannot appear as a child of ' +
+ ' in this context (p).'
);
});
@@ -694,9 +696,10 @@ describe('ReactDOMComponent', function() {
expect(console.error.calls.length).toBe(1);
expect(console.error.calls[0].args[0]).toBe(
- 'Warning: validateDOMNesting(...):
cannot contain a ' +
- 'node. Add a
to your code to match the DOM tree generated by ' +
- 'the browser. Check the render method of `Foo`.'
+ 'Warning: validateDOMNesting(...): cannot appear as a child of ' +
+ ' in this context (div > table). Add a to your code ' +
+ 'to match the DOM tree generated by the browser. Check the render ' +
+ 'method of `Foo`.'
);
});
});
diff --git a/src/browser/validateDOMNesting.js b/src/browser/validateDOMNesting.js
index e759b3eba6..3ac521d0d7 100644
--- a/src/browser/validateDOMNesting.js
+++ b/src/browser/validateDOMNesting.js
@@ -176,6 +176,10 @@ if (__DEV__) {
tag === 'noscript' || tag === 'noframes' || tag === 'style' ||
tag === 'script' || tag === 'template'
);
+
+ // https://html.spec.whatwg.org/multipage/semantics.html#the-html-element
+ case 'html':
+ return tag === 'head' || tag === 'body';
}
// Probably in the "in body" parsing mode, so we outlaw only tag combos
@@ -292,9 +296,11 @@ if (__DEV__) {
warning(
false,
- 'validateDOMNesting(...): <%s> cannot contain a <%s> node.%s',
- parentTag,
+ 'validateDOMNesting(...): <%s> cannot appear as a child of <%s> ' +
+ 'in this context (%s).%s',
childTag,
+ parentTag,
+ parentStack.join(' > '),
info
);
}