Tweak validation message, add html support
The old message made no sense if you had a > div > a or similar. I'm clearly feeling sloppy today.
Ben Alpert committed
Mar 25, 2015 at 17:24 UTC
7c6694987dcae9ee1e471c9ee8541fb2dfb9052f
2 files changed
+16
-7
src/browser/ui/__tests__/ReactDOMComponent-test.js
+8
-5
@@ -668,7 +668,8 @@ describe('ReactDOMComponent', function() {
668
669
expect(console.error.calls.length).toBe(1);
670
expect(console.error.calls[0].args[0]).toBe(
671
- 'Warning: validateDOMNesting(...): <div> cannot contain a <tr> node.'
671
+ 'Warning: validateDOMNesting(...): <tr> cannot appear as a child of ' +
672
+ '<div> in this context (div > div).'
673
);
674
});
675
@@ -679,7 +680,8 @@ describe('ReactDOMComponent', function() {
680
681
expect(console.error.calls.length).toBe(1);
682
expect(console.error.calls[0].args[0]).toBe(
682
- 'Warning: validateDOMNesting(...): <p> cannot contain a <tr> node.'
683
+ 'Warning: validateDOMNesting(...): <tr> cannot appear as a child of ' +
684
+ '<p> in this context (p).'
685
);
686
});
687
@@ -694,9 +696,10 @@ describe('ReactDOMComponent', function() {
696
697
expect(console.error.calls.length).toBe(1);
698
expect(console.error.calls[0].args[0]).toBe(
697
- 'Warning: validateDOMNesting(...): <table> cannot contain a <tr> ' +
698
- 'node. Add a <tbody> to your code to match the DOM tree generated by ' +
699
- 'the browser. Check the render method of `Foo`.'
699
+ 'Warning: validateDOMNesting(...): <tr> cannot appear as a child of ' +
700
+ '<table> in this context (div > table). Add a <tbody> to your code ' +
701
+ 'to match the DOM tree generated by the browser. Check the render ' +
702
+ 'method of `Foo`.'
703
);
704
});
705
});
src/browser/validateDOMNesting.js
+8
-2
@@ -176,6 +176,10 @@ if (__DEV__) {
176
tag === 'noscript' || tag === 'noframes' || tag === 'style' ||
177
tag === 'script' || tag === 'template'
178
);
179
+
180
+ // https://html.spec.whatwg.org/multipage/semantics.html#the-html-element
181
+ case 'html':
182
+ return tag === 'head' || tag === 'body';
183
}
184
185
// Probably in the "in body" parsing mode, so we outlaw only tag combos
@@ -292,9 +296,11 @@ if (__DEV__) {
296
297
warning(
298
false,
295
- 'validateDOMNesting(...): <%s> cannot contain a <%s> node.%s',
296
- parentTag,
299
+ 'validateDOMNesting(...): <%s> cannot appear as a child of <%s> ' +
300
+ 'in this context (%s).%s',
301
childTag,
302
+ parentTag,
303
+ parentStack.join(' > '),
304
info
305
);
306
}