diff --git a/src/renderers/dom/server/__tests__/ReactServerRendering-test.js b/src/renderers/dom/server/__tests__/ReactServerRendering-test.js
index e552678c8a6c4..1c3753028a3e6 100644
--- a/src/renderers/dom/server/__tests__/ReactServerRendering-test.js
+++ b/src/renderers/dom/server/__tests__/ReactServerRendering-test.js
@@ -538,4 +538,38 @@ describe('ReactServerRendering', function() {
var markup = ReactServerRendering.renderToStaticMarkup();
expect(markup).toBe('
');
});
+
+ it('warns when children are mutated before render', function() {
+ function normalizeCodeLocInfo(str) {
+ return str.replace(/\(at .+?:\d+\)/g, '(at **)');
+ }
+
+ spyOn(console, 'error');
+ var children = [, , ];
+ var element = {children}
;
+ children[1] = ; // Mutation is illegal
+ ReactServerRendering.renderToString(element);
+ expect(console.error.calls.count()).toBe(1);
+ expect(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe(
+ 'Warning: Component\'s children should not be mutated.\n in div (at **)'
+ );
+ });
+
+ it('should warn when children are mutated', function() {
+ function normalizeCodeLocInfo(str) {
+ return str.replace(/\(at .+?:\d+\)/g, '(at **)');
+ }
+
+ spyOn(console, 'error');
+ var children = [, , ];
+ function Wrapper(props) {
+ props.children[1] = ; // Mutation is illegal
+ return {props.children}
;
+ }
+ ReactServerRendering.renderToString({children});
+ expect(console.error.calls.count()).toBe(1);
+ expect(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe(
+ 'Warning: Component\'s children should not be mutated.\n in Wrapper (at **)'
+ );
+ });
});
diff --git a/src/renderers/shared/hooks/ReactChildrenMutationWarningHook.js b/src/renderers/shared/hooks/ReactChildrenMutationWarningHook.js
index fccc1538545ad..e8d063d58a9a6 100644
--- a/src/renderers/shared/hooks/ReactChildrenMutationWarningHook.js
+++ b/src/renderers/shared/hooks/ReactChildrenMutationWarningHook.js
@@ -15,8 +15,6 @@ var ReactComponentTreeHook = require('ReactComponentTreeHook');
var warning = require('warning');
-var elements = {};
-
function handleElement(debugID, element) {
if (element == null) {
return;
@@ -46,21 +44,13 @@ function handleElement(debugID, element) {
);
}
-var ReactDOMUnknownPropertyHook = {
- onBeforeMountComponent(debugID, element) {
- elements[debugID] = element;
- },
- onBeforeUpdateComponent(debugID, element) {
- elements[debugID] = element;
- },
- onComponentHasMounted(debugID) {
- handleElement(debugID, elements[debugID]);
- delete elements[debugID];
+var ReactChildrenMutationWarningHook = {
+ onMountComponent(debugID) {
+ handleElement(debugID, ReactComponentTreeHook.getElement(debugID));
},
onComponentHasUpdated(debugID) {
- handleElement(debugID, elements[debugID]);
- delete elements[debugID];
+ handleElement(debugID, ReactComponentTreeHook.getElement(debugID));
},
};
-module.exports = ReactDOMUnknownPropertyHook;
+module.exports = ReactChildrenMutationWarningHook;