From b4a3d587aaa2315c6c97955010d1f2aebecdc0eb Mon Sep 17 00:00:00 2001
From: Troy DeMonbreun <github@troyd.net>
Date: Fri, 1 Apr 2016 21:26:39 +0000
Subject: [PATCH 1/4] Fix for #6062 : Show source line number on unknown
 property warning

---
 scripts/jest/preprocessor.js                  |  1 +
 src/renderers/dom/shared/ReactDOMComponent.js |  4 ++
 src/renderers/dom/shared/ReactDOMDebugTool.js |  4 +-
 .../__tests__/ReactDOMComponent-test.js       | 10 +++++
 .../ReactDOMUnknownPropertyDevtool.js         | 38 ++++++++++++++-----
 5 files changed, 46 insertions(+), 11 deletions(-)

diff --git a/scripts/jest/preprocessor.js b/scripts/jest/preprocessor.js
index af2882a0d8ce0..f331ad82d3afa 100644
--- a/scripts/jest/preprocessor.js
+++ b/scripts/jest/preprocessor.js
@@ -28,6 +28,7 @@ var pathToBabelrc = path.join(__dirname, '..', '..', '.babelrc');
 var babelOptions = {
   plugins: [
     [babelPluginModules, { map: moduleMap }],
+    'transform-react-jsx-source',
   ],
   retainLines: true,
 };
diff --git a/src/renderers/dom/shared/ReactDOMComponent.js b/src/renderers/dom/shared/ReactDOMComponent.js
index f4a95edbe0259..d7306e7728fc0 100644
--- a/src/renderers/dom/shared/ReactDOMComponent.js
+++ b/src/renderers/dom/shared/ReactDOMComponent.js
@@ -29,6 +29,7 @@ var ReactDOMButton = require('ReactDOMButton');
 var ReactDOMComponentFlags = require('ReactDOMComponentFlags');
 var ReactDOMComponentTree = require('ReactDOMComponentTree');
 var ReactDOMInput = require('ReactDOMInput');
+var ReactDOMInstrumentation = require('ReactDOMInstrumentation');
 var ReactDOMOption = require('ReactDOMOption');
 var ReactDOMSelect = require('ReactDOMSelect');
 var ReactDOMTextarea = require('ReactDOMTextarea');
@@ -644,6 +645,9 @@ ReactDOMComponent.Mixin = {
             markup = DOMPropertyOperations.createMarkupForCustomAttribute(propKey, propValue);
           }
         } else {
+          if (__DEV__) {
+            ReactDOMInstrumentation.debugTool.onCreateMarkupForProperty(propKey, propValue, this._currentElement);
+          }
           markup = DOMPropertyOperations.createMarkupForProperty(propKey, propValue);
         }
         if (markup) {
diff --git a/src/renderers/dom/shared/ReactDOMDebugTool.js b/src/renderers/dom/shared/ReactDOMDebugTool.js
index 9fcc3763fadb1..2b8c8c28ab4d0 100644
--- a/src/renderers/dom/shared/ReactDOMDebugTool.js
+++ b/src/renderers/dom/shared/ReactDOMDebugTool.js
@@ -50,8 +50,8 @@ var ReactDOMDebugTool = {
       }
     }
   },
-  onCreateMarkupForProperty(name, value) {
-    emitEvent('onCreateMarkupForProperty', name, value);
+  onCreateMarkupForProperty(name, value, element) {
+    emitEvent('onCreateMarkupForProperty', name, value, element);
   },
   onSetValueForProperty(node, name, value) {
     emitEvent('onSetValueForProperty', node, name, value);
diff --git a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
index 0fbbee1e17a9a..434a92e9db9ca 100644
--- a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
+++ b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
@@ -1234,5 +1234,15 @@ describe('ReactDOMComponent', function() {
       expect(console.error.argsForCall.length).toBe(1);
       expect(console.error.argsForCall[0][0]).toContain('className');
     });
+
+    it('gives source code refs for unknown property warnings', function() {
+      spyOn(console, 'error');
+      ReactDOMServer.renderToString(<input type="text" onclick="1"/>);
+      ReactDOMServer.renderToString(<div class="muffins"/>);
+      expect(console.error.argsForCall.length).toBe(2);
+      expect(console.error.argsForCall[0][0]).toMatch(/.*\(.*:\d+\)/);
+      expect(console.error.argsForCall[1][0]).toMatch(/.*\(.*:\d+\)/);
+    });
+
   });
 });
diff --git a/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js b/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
index 5adc359063e1e..d0670a71eb5ee 100644
--- a/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
+++ b/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
@@ -13,6 +13,7 @@
 
 var DOMProperty = require('DOMProperty');
 var EventPluginRegistry = require('EventPluginRegistry');
+var ReactDOMComponentTree = require('ReactDOMComponentTree');
 
 var warning = require('warning');
 
@@ -25,7 +26,7 @@ if (__DEV__) {
   };
   var warnedProperties = {};
 
-  var warnUnknownProperty = function(name) {
+  var warnUnknownProperty = function(name, source) {
     if (DOMProperty.properties.hasOwnProperty(name) || DOMProperty.isCustomAttribute(name)) {
       return;
     }
@@ -50,9 +51,10 @@ if (__DEV__) {
     // logging too much when using transferPropsTo.
     warning(
       standardName == null,
-      'Unknown DOM property %s. Did you mean %s?',
+      'Unknown DOM property %s. Did you mean %s? %s',
       name,
-      standardName
+      standardName,
+      formatSource(source)
     );
 
     var registrationName = (
@@ -65,23 +67,41 @@ if (__DEV__) {
 
     warning(
       registrationName == null,
-      'Unknown event handler property %s. Did you mean `%s`?',
+      'Unknown event handler property %s. Did you mean `%s`? %s',
       name,
-      registrationName
+      registrationName,
+      formatSource(source)
     );
   };
+
+  var formatSource = function(source) {
+    return source ? `(${source.fileName.replace(/^.*[\\\/]/, '')}:${source.lineNumber})` : '';
+  };
 }
 
 var ReactDOMUnknownPropertyDevtool = {
-  onCreateMarkupForProperty(name, value) {
-    warnUnknownProperty(name);
+  onCreateMarkupForProperty(name, value, element) {
+    warnUnknownProperty(name, getSourceFromElement(element));
   },
   onSetValueForProperty(node, name, value) {
-    warnUnknownProperty(name);
+    warnUnknownProperty(name, getSourceFromNode(node));
   },
   onDeleteValueForProperty(node, name) {
-    warnUnknownProperty(name);
+    warnUnknownProperty(name, getSourceFromNode(node));
   },
 };
 
+var getSourceFromNode = function(node) {
+  var instance = ReactDOMComponentTree.getInstanceFromNode(node);
+  if (instance) {
+    return getSourceFromElement(instance._currentElement);
+  }
+};
+
+var getSourceFromElement = function(element) {
+  if (element) {
+    return element._source;
+  }
+};
+
 module.exports = ReactDOMUnknownPropertyDevtool;

From 6af1c282eeb8718ecccb997e4ee37c36b2c7a7eb Mon Sep 17 00:00:00 2001
From: Troy DeMonbreun <github@troyd.net>
Date: Fri, 1 Apr 2016 21:26:39 +0000
Subject: [PATCH 2/4] Fix for #6062 : Show source line number on unknown
 property warning

---
 scripts/jest/preprocessor.js                  |  1 +
 src/renderers/dom/shared/ReactDOMComponent.js |  4 ++
 src/renderers/dom/shared/ReactDOMDebugTool.js |  4 +-
 .../__tests__/ReactDOMComponent-test.js       |  9 +++++
 .../ReactDOMUnknownPropertyDevtool.js         | 38 ++++++++++++++-----
 5 files changed, 45 insertions(+), 11 deletions(-)

diff --git a/scripts/jest/preprocessor.js b/scripts/jest/preprocessor.js
index af2882a0d8ce0..f331ad82d3afa 100644
--- a/scripts/jest/preprocessor.js
+++ b/scripts/jest/preprocessor.js
@@ -28,6 +28,7 @@ var pathToBabelrc = path.join(__dirname, '..', '..', '.babelrc');
 var babelOptions = {
   plugins: [
     [babelPluginModules, { map: moduleMap }],
+    'transform-react-jsx-source',
   ],
   retainLines: true,
 };
diff --git a/src/renderers/dom/shared/ReactDOMComponent.js b/src/renderers/dom/shared/ReactDOMComponent.js
index 3e789d33b14ac..31054bd5efc92 100644
--- a/src/renderers/dom/shared/ReactDOMComponent.js
+++ b/src/renderers/dom/shared/ReactDOMComponent.js
@@ -29,6 +29,7 @@ var ReactDOMButton = require('ReactDOMButton');
 var ReactDOMComponentFlags = require('ReactDOMComponentFlags');
 var ReactDOMComponentTree = require('ReactDOMComponentTree');
 var ReactDOMInput = require('ReactDOMInput');
+var ReactDOMInstrumentation = require('ReactDOMInstrumentation');
 var ReactDOMOption = require('ReactDOMOption');
 var ReactDOMSelect = require('ReactDOMSelect');
 var ReactDOMTextarea = require('ReactDOMTextarea');
@@ -651,6 +652,9 @@ ReactDOMComponent.Mixin = {
             markup = DOMPropertyOperations.createMarkupForCustomAttribute(propKey, propValue);
           }
         } else {
+          if (__DEV__) {
+            ReactDOMInstrumentation.debugTool.onCreateMarkupForProperty(propKey, propValue, this._currentElement);
+          }
           markup = DOMPropertyOperations.createMarkupForProperty(propKey, propValue);
         }
         if (markup) {
diff --git a/src/renderers/dom/shared/ReactDOMDebugTool.js b/src/renderers/dom/shared/ReactDOMDebugTool.js
index 9fcc3763fadb1..2b8c8c28ab4d0 100644
--- a/src/renderers/dom/shared/ReactDOMDebugTool.js
+++ b/src/renderers/dom/shared/ReactDOMDebugTool.js
@@ -50,8 +50,8 @@ var ReactDOMDebugTool = {
       }
     }
   },
-  onCreateMarkupForProperty(name, value) {
-    emitEvent('onCreateMarkupForProperty', name, value);
+  onCreateMarkupForProperty(name, value, element) {
+    emitEvent('onCreateMarkupForProperty', name, value, element);
   },
   onSetValueForProperty(node, name, value) {
     emitEvent('onSetValueForProperty', node, name, value);
diff --git a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
index 2fb18a526323b..28de31226d8bb 100644
--- a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
+++ b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
@@ -1246,5 +1246,14 @@ describe('ReactDOMComponent', function() {
       ReactTestUtils.renderIntoDocument(<div onFocusOut={() => {}} />);
       expect(console.error.argsForCall.length).toBe(2);
     });
+
+    it('gives source code refs for unknown property warnings', function() {
+      spyOn(console, 'error');
+      ReactDOMServer.renderToString(<input type="text" onclick="1"/>);
+      ReactDOMServer.renderToString(<div class="muffins"/>);
+      expect(console.error.argsForCall.length).toBe(2);
+      expect(console.error.argsForCall[0][0]).toMatch(/.*\(.*:\d+\)/);
+      expect(console.error.argsForCall[1][0]).toMatch(/.*\(.*:\d+\)/);
+    });
   });
 });
diff --git a/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js b/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
index 5adc359063e1e..d0670a71eb5ee 100644
--- a/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
+++ b/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
@@ -13,6 +13,7 @@
 
 var DOMProperty = require('DOMProperty');
 var EventPluginRegistry = require('EventPluginRegistry');
+var ReactDOMComponentTree = require('ReactDOMComponentTree');
 
 var warning = require('warning');
 
@@ -25,7 +26,7 @@ if (__DEV__) {
   };
   var warnedProperties = {};
 
-  var warnUnknownProperty = function(name) {
+  var warnUnknownProperty = function(name, source) {
     if (DOMProperty.properties.hasOwnProperty(name) || DOMProperty.isCustomAttribute(name)) {
       return;
     }
@@ -50,9 +51,10 @@ if (__DEV__) {
     // logging too much when using transferPropsTo.
     warning(
       standardName == null,
-      'Unknown DOM property %s. Did you mean %s?',
+      'Unknown DOM property %s. Did you mean %s? %s',
       name,
-      standardName
+      standardName,
+      formatSource(source)
     );
 
     var registrationName = (
@@ -65,23 +67,41 @@ if (__DEV__) {
 
     warning(
       registrationName == null,
-      'Unknown event handler property %s. Did you mean `%s`?',
+      'Unknown event handler property %s. Did you mean `%s`? %s',
       name,
-      registrationName
+      registrationName,
+      formatSource(source)
     );
   };
+
+  var formatSource = function(source) {
+    return source ? `(${source.fileName.replace(/^.*[\\\/]/, '')}:${source.lineNumber})` : '';
+  };
 }
 
 var ReactDOMUnknownPropertyDevtool = {
-  onCreateMarkupForProperty(name, value) {
-    warnUnknownProperty(name);
+  onCreateMarkupForProperty(name, value, element) {
+    warnUnknownProperty(name, getSourceFromElement(element));
   },
   onSetValueForProperty(node, name, value) {
-    warnUnknownProperty(name);
+    warnUnknownProperty(name, getSourceFromNode(node));
   },
   onDeleteValueForProperty(node, name) {
-    warnUnknownProperty(name);
+    warnUnknownProperty(name, getSourceFromNode(node));
   },
 };
 
+var getSourceFromNode = function(node) {
+  var instance = ReactDOMComponentTree.getInstanceFromNode(node);
+  if (instance) {
+    return getSourceFromElement(instance._currentElement);
+  }
+};
+
+var getSourceFromElement = function(element) {
+  if (element) {
+    return element._source;
+  }
+};
+
 module.exports = ReactDOMUnknownPropertyDevtool;

From b587f4d04f69de928c769e36d9cfd5783054f871 Mon Sep 17 00:00:00 2001
From: Troy DeMonbreun <github@troyd.net>
Date: Fri, 1 Apr 2016 21:26:39 +0000
Subject: [PATCH 3/4] Fix for #6062 : Show source line number on unknown
 property warning

---
 scripts/jest/preprocessor.js                  |  1 +
 src/renderers/dom/shared/ReactDOMComponent.js |  4 ++
 src/renderers/dom/shared/ReactDOMDebugTool.js |  4 +-
 .../__tests__/ReactDOMComponent-test.js       |  9 +++++
 .../ReactDOMUnknownPropertyDevtool.js         | 38 ++++++++++++++-----
 5 files changed, 45 insertions(+), 11 deletions(-)

diff --git a/scripts/jest/preprocessor.js b/scripts/jest/preprocessor.js
index af2882a0d8ce0..f331ad82d3afa 100644
--- a/scripts/jest/preprocessor.js
+++ b/scripts/jest/preprocessor.js
@@ -28,6 +28,7 @@ var pathToBabelrc = path.join(__dirname, '..', '..', '.babelrc');
 var babelOptions = {
   plugins: [
     [babelPluginModules, { map: moduleMap }],
+    'transform-react-jsx-source',
   ],
   retainLines: true,
 };
diff --git a/src/renderers/dom/shared/ReactDOMComponent.js b/src/renderers/dom/shared/ReactDOMComponent.js
index 3e789d33b14ac..31054bd5efc92 100644
--- a/src/renderers/dom/shared/ReactDOMComponent.js
+++ b/src/renderers/dom/shared/ReactDOMComponent.js
@@ -29,6 +29,7 @@ var ReactDOMButton = require('ReactDOMButton');
 var ReactDOMComponentFlags = require('ReactDOMComponentFlags');
 var ReactDOMComponentTree = require('ReactDOMComponentTree');
 var ReactDOMInput = require('ReactDOMInput');
+var ReactDOMInstrumentation = require('ReactDOMInstrumentation');
 var ReactDOMOption = require('ReactDOMOption');
 var ReactDOMSelect = require('ReactDOMSelect');
 var ReactDOMTextarea = require('ReactDOMTextarea');
@@ -651,6 +652,9 @@ ReactDOMComponent.Mixin = {
             markup = DOMPropertyOperations.createMarkupForCustomAttribute(propKey, propValue);
           }
         } else {
+          if (__DEV__) {
+            ReactDOMInstrumentation.debugTool.onCreateMarkupForProperty(propKey, propValue, this._currentElement);
+          }
           markup = DOMPropertyOperations.createMarkupForProperty(propKey, propValue);
         }
         if (markup) {
diff --git a/src/renderers/dom/shared/ReactDOMDebugTool.js b/src/renderers/dom/shared/ReactDOMDebugTool.js
index 9fcc3763fadb1..2b8c8c28ab4d0 100644
--- a/src/renderers/dom/shared/ReactDOMDebugTool.js
+++ b/src/renderers/dom/shared/ReactDOMDebugTool.js
@@ -50,8 +50,8 @@ var ReactDOMDebugTool = {
       }
     }
   },
-  onCreateMarkupForProperty(name, value) {
-    emitEvent('onCreateMarkupForProperty', name, value);
+  onCreateMarkupForProperty(name, value, element) {
+    emitEvent('onCreateMarkupForProperty', name, value, element);
   },
   onSetValueForProperty(node, name, value) {
     emitEvent('onSetValueForProperty', node, name, value);
diff --git a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
index 2fb18a526323b..28de31226d8bb 100644
--- a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
+++ b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
@@ -1246,5 +1246,14 @@ describe('ReactDOMComponent', function() {
       ReactTestUtils.renderIntoDocument(<div onFocusOut={() => {}} />);
       expect(console.error.argsForCall.length).toBe(2);
     });
+
+    it('gives source code refs for unknown property warnings', function() {
+      spyOn(console, 'error');
+      ReactDOMServer.renderToString(<input type="text" onclick="1"/>);
+      ReactDOMServer.renderToString(<div class="muffins"/>);
+      expect(console.error.argsForCall.length).toBe(2);
+      expect(console.error.argsForCall[0][0]).toMatch(/.*\(.*:\d+\)/);
+      expect(console.error.argsForCall[1][0]).toMatch(/.*\(.*:\d+\)/);
+    });
   });
 });
diff --git a/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js b/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
index 5adc359063e1e..d0670a71eb5ee 100644
--- a/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
+++ b/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
@@ -13,6 +13,7 @@
 
 var DOMProperty = require('DOMProperty');
 var EventPluginRegistry = require('EventPluginRegistry');
+var ReactDOMComponentTree = require('ReactDOMComponentTree');
 
 var warning = require('warning');
 
@@ -25,7 +26,7 @@ if (__DEV__) {
   };
   var warnedProperties = {};
 
-  var warnUnknownProperty = function(name) {
+  var warnUnknownProperty = function(name, source) {
     if (DOMProperty.properties.hasOwnProperty(name) || DOMProperty.isCustomAttribute(name)) {
       return;
     }
@@ -50,9 +51,10 @@ if (__DEV__) {
     // logging too much when using transferPropsTo.
     warning(
       standardName == null,
-      'Unknown DOM property %s. Did you mean %s?',
+      'Unknown DOM property %s. Did you mean %s? %s',
       name,
-      standardName
+      standardName,
+      formatSource(source)
     );
 
     var registrationName = (
@@ -65,23 +67,41 @@ if (__DEV__) {
 
     warning(
       registrationName == null,
-      'Unknown event handler property %s. Did you mean `%s`?',
+      'Unknown event handler property %s. Did you mean `%s`? %s',
       name,
-      registrationName
+      registrationName,
+      formatSource(source)
     );
   };
+
+  var formatSource = function(source) {
+    return source ? `(${source.fileName.replace(/^.*[\\\/]/, '')}:${source.lineNumber})` : '';
+  };
 }
 
 var ReactDOMUnknownPropertyDevtool = {
-  onCreateMarkupForProperty(name, value) {
-    warnUnknownProperty(name);
+  onCreateMarkupForProperty(name, value, element) {
+    warnUnknownProperty(name, getSourceFromElement(element));
   },
   onSetValueForProperty(node, name, value) {
-    warnUnknownProperty(name);
+    warnUnknownProperty(name, getSourceFromNode(node));
   },
   onDeleteValueForProperty(node, name) {
-    warnUnknownProperty(name);
+    warnUnknownProperty(name, getSourceFromNode(node));
   },
 };
 
+var getSourceFromNode = function(node) {
+  var instance = ReactDOMComponentTree.getInstanceFromNode(node);
+  if (instance) {
+    return getSourceFromElement(instance._currentElement);
+  }
+};
+
+var getSourceFromElement = function(element) {
+  if (element) {
+    return element._source;
+  }
+};
+
 module.exports = ReactDOMUnknownPropertyDevtool;

From fb2910fe7171d495639355ebfe5b7b0dd606fea0 Mon Sep 17 00:00:00 2001
From: Troy DeMonbreun <github@troyd.net>
Date: Mon, 4 Apr 2016 20:20:30 +0000
Subject: [PATCH 4/4] New approach to fix for #6062

---
 src/renderers/dom/shared/ReactDOMComponent.js |  4 ---
 src/renderers/dom/shared/ReactDOMDebugTool.js |  7 +++--
 .../ReactDOMUnknownPropertyDevtool.js         | 27 +++++++------------
 .../reconciler/instantiateReactComponent.js   |  5 ++++
 4 files changed, 19 insertions(+), 24 deletions(-)

diff --git a/src/renderers/dom/shared/ReactDOMComponent.js b/src/renderers/dom/shared/ReactDOMComponent.js
index 31054bd5efc92..3e789d33b14ac 100644
--- a/src/renderers/dom/shared/ReactDOMComponent.js
+++ b/src/renderers/dom/shared/ReactDOMComponent.js
@@ -29,7 +29,6 @@ var ReactDOMButton = require('ReactDOMButton');
 var ReactDOMComponentFlags = require('ReactDOMComponentFlags');
 var ReactDOMComponentTree = require('ReactDOMComponentTree');
 var ReactDOMInput = require('ReactDOMInput');
-var ReactDOMInstrumentation = require('ReactDOMInstrumentation');
 var ReactDOMOption = require('ReactDOMOption');
 var ReactDOMSelect = require('ReactDOMSelect');
 var ReactDOMTextarea = require('ReactDOMTextarea');
@@ -652,9 +651,6 @@ ReactDOMComponent.Mixin = {
             markup = DOMPropertyOperations.createMarkupForCustomAttribute(propKey, propValue);
           }
         } else {
-          if (__DEV__) {
-            ReactDOMInstrumentation.debugTool.onCreateMarkupForProperty(propKey, propValue, this._currentElement);
-          }
           markup = DOMPropertyOperations.createMarkupForProperty(propKey, propValue);
         }
         if (markup) {
diff --git a/src/renderers/dom/shared/ReactDOMDebugTool.js b/src/renderers/dom/shared/ReactDOMDebugTool.js
index 2b8c8c28ab4d0..ac7bb10d6dab4 100644
--- a/src/renderers/dom/shared/ReactDOMDebugTool.js
+++ b/src/renderers/dom/shared/ReactDOMDebugTool.js
@@ -50,8 +50,8 @@ var ReactDOMDebugTool = {
       }
     }
   },
-  onCreateMarkupForProperty(name, value, element) {
-    emitEvent('onCreateMarkupForProperty', name, value, element);
+  onCreateMarkupForProperty(name, value) {
+    emitEvent('onCreateMarkupForProperty', name, value);
   },
   onSetValueForProperty(node, name, value) {
     emitEvent('onSetValueForProperty', node, name, value);
@@ -59,6 +59,9 @@ var ReactDOMDebugTool = {
   onDeleteValueForProperty(node, name) {
     emitEvent('onDeleteValueForProperty', node, name);
   },
+  onInstantiateReactComponent(instance) {
+    emitEvent('onInstantiateReactComponent', instance);
+  },
 };
 
 ReactDOMDebugTool.addDevtool(ReactDOMUnknownPropertyDevtool);
diff --git a/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js b/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
index d0670a71eb5ee..cb613436cfee2 100644
--- a/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
+++ b/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
@@ -13,11 +13,11 @@
 
 var DOMProperty = require('DOMProperty');
 var EventPluginRegistry = require('EventPluginRegistry');
-var ReactDOMComponentTree = require('ReactDOMComponentTree');
 
 var warning = require('warning');
 
 if (__DEV__) {
+  var cachedSource;
   var reactProps = {
     children: true,
     dangerouslySetInnerHTML: true,
@@ -80,28 +80,19 @@ if (__DEV__) {
 }
 
 var ReactDOMUnknownPropertyDevtool = {
-  onCreateMarkupForProperty(name, value, element) {
-    warnUnknownProperty(name, getSourceFromElement(element));
+  onCreateMarkupForProperty(name, value) {
+    warnUnknownProperty(name, cachedSource);
   },
   onSetValueForProperty(node, name, value) {
-    warnUnknownProperty(name, getSourceFromNode(node));
+    warnUnknownProperty(name, cachedSource);
   },
   onDeleteValueForProperty(node, name) {
-    warnUnknownProperty(name, getSourceFromNode(node));
+    warnUnknownProperty(name, cachedSource);
+  },
+  onInstantiateReactComponent(instance) {
+    //Get JSX _source for use in warnings
+    cachedSource = instance._currentElement ? instance._currentElement._source : null;
   },
-};
-
-var getSourceFromNode = function(node) {
-  var instance = ReactDOMComponentTree.getInstanceFromNode(node);
-  if (instance) {
-    return getSourceFromElement(instance._currentElement);
-  }
-};
-
-var getSourceFromElement = function(element) {
-  if (element) {
-    return element._source;
-  }
 };
 
 module.exports = ReactDOMUnknownPropertyDevtool;
diff --git a/src/renderers/shared/reconciler/instantiateReactComponent.js b/src/renderers/shared/reconciler/instantiateReactComponent.js
index cb0208f92a68f..322f13295c2b2 100644
--- a/src/renderers/shared/reconciler/instantiateReactComponent.js
+++ b/src/renderers/shared/reconciler/instantiateReactComponent.js
@@ -12,6 +12,7 @@
 'use strict';
 
 var ReactCompositeComponent = require('ReactCompositeComponent');
+var ReactDOMInstrumentation = require('ReactDOMInstrumentation');
 var ReactEmptyComponent = require('ReactEmptyComponent');
 var ReactNativeComponent = require('ReactNativeComponent');
 
@@ -130,6 +131,10 @@ function instantiateReactComponent(node) {
     }
   }
 
+  if (__DEV__) {
+    ReactDOMInstrumentation.debugTool.onInstantiateReactComponent(instance);
+  }
+
   return instance;
 }