Use duck typing instead of allocating event objects

zpao · Dec 17, 2015 · 26f3785 · 26f3785
1 parent 30ef056
commit 26f3785
Show file tree

Hide file tree

Showing 6 changed files with 105 additions and 74 deletions.
diff --git a/src/renderers/dom/ReactDOM.js b/src/renderers/dom/ReactDOM.js
@@ -14,8 +14,6 @@
 'use strict';
 
 var ReactDOMComponentTree = require('ReactDOMComponentTree');
-var ReactDOMDevtools = require('ReactDOMDevtools');
-var ReactDOMUnknownPropertyDevtool = require('ReactDOMUnknownPropertyDevtool');
 var ReactDefaultInjection = require('ReactDefaultInjection');
 var ReactMount = require('ReactMount');
 var ReactPerf = require('ReactPerf');
@@ -137,8 +135,6 @@ if (__DEV__) {
         break;
       }
     }
-
-    ReactDOMDevtools.addDevtool(new ReactDOMUnknownPropertyDevtool());
   }
 }
 

diff --git a/src/renderers/dom/shared/DOMPropertyOperations.js b/src/renderers/dom/shared/DOMPropertyOperations.js
@@ -12,7 +12,7 @@
 'use strict';
 
 var DOMProperty = require('DOMProperty');
-var ReactDOMDevtools = require('ReactDOMDevtools');
+var ReactDOMInstrumentation = require('ReactDOMInstrumentation');
 var ReactPerf = require('ReactPerf');
 
 var quoteAttributeValueForBrowser = require('quoteAttributeValueForBrowser');
@@ -87,7 +87,9 @@ var DOMPropertyOperations = {
    * @return {?string} Markup string, or null if the property was invalid.
    */
   createMarkupForProperty: function(name, value) {
-    ReactDOMDevtools.emitEvent('createMarkupForProperty', {name, value});
+    if (__DEV__) {
+      ReactDOMInstrumentation.debugTool.onCreateMarkupForProperty(name, value);
+    }
     var propertyInfo = DOMProperty.properties.hasOwnProperty(name) ?
         DOMProperty.properties[name] : null;
     if (propertyInfo) {
@@ -131,7 +133,9 @@ var DOMPropertyOperations = {
    * @param {*} value
    */
   setValueForProperty: function(node, name, value) {
-    ReactDOMDevtools.emitEvent('setValueForProperty', {node, name, value});
+    if (__DEV__) {
+      ReactDOMInstrumentation.debugTool.onSetValueForProperty(node, name, value);
+    }
     var propertyInfo = DOMProperty.properties.hasOwnProperty(name) ?
         DOMProperty.properties[name] : null;
     if (propertyInfo) {
@@ -187,7 +191,9 @@ var DOMPropertyOperations = {
    * @param {string} name
    */
   deleteValueForProperty: function(node, name) {
-    ReactDOMDevtools.emitEvent('deleteValueForProperty', {node, name});
+    if (__DEV__) {
+      ReactDOMInstrumentation.debugTool.onDeleteValueForProperty(node, name);
+    }
     var propertyInfo = DOMProperty.properties.hasOwnProperty(name) ?
         DOMProperty.properties[name] : null;
     if (propertyInfo) {

diff --git a/src/renderers/dom/shared/ReactDOMDebugTool.js b/src/renderers/dom/shared/ReactDOMDebugTool.js
@@ -0,0 +1,66 @@
+/**
+ * Copyright 2013-2015, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule ReactDOMDebugTool
+ */
+
+'use strict';
+
+var ReactDOMUnknownPropertyDevtool = require('ReactDOMUnknownPropertyDevtool');
+
+var warning = require('warning');
+
+var eventHandlers = [];
+var handlerDoesThrowForEvent = {};
+
+function emitEvent(handlerFunctionName, arg1, arg2, arg3, arg4, arg5) {
+  if (__DEV__) {
+    eventHandlers.forEach(function(handler) {
+      try {
+        if (handler[handlerFunctionName]) {
+          handler[handlerFunctionName](arg1, arg2, arg3, arg4, arg5);
+        }
+      } catch (e) {
+        warning(
+          !handlerDoesThrowForEvent[handlerFunctionName],
+          'exception thrown by devtool while handling %s: %s',
+          handlerFunctionName,
+          e.message
+        );
+        handlerDoesThrowForEvent[handlerFunctionName] = true;
+      }
+    });
+  }
+}
+
+var ReactDOMDebugTool = {
+  addDevtool(devtool) {
+    eventHandlers.push(devtool);
+  },
+  removeDevtool(devtool) {
+    for (var i = 0; i < eventHandlers.length; i++) {
+      if (eventHandlers[i] === devtool) {
+        eventHandlers.splice(i, 1);
+        i--;
+      }
+    }
+  },
+  onCreateMarkupForProperty(name, value) {
+    emitEvent('onCreateMarkupForProperty', name, value);
+  },
+  onSetValueForProperty(node, name, value) {
+    emitEvent('onSetValueForProperty', node, name, value);
+  },
+  onDeleteValueForProperty(node, name) {
+    emitEvent('onDeleteValueForProperty', node, name);
+  },
+};
+
+ReactDOMDebugTool.addDevtool(ReactDOMUnknownPropertyDevtool);
+
+module.exports = ReactDOMDebugTool;
diff --git a/src/renderers/dom/shared/ReactDOMDevtools.js b/src/renderers/dom/shared/ReactDOMDevtools.js
diff --git a/src/renderers/dom/shared/ReactDOMInstrumentation.js b/src/renderers/dom/shared/ReactDOMInstrumentation.js
@@ -0,0 +1,16 @@
+/**
+ * Copyright 2013-2015, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule ReactDOMInstrumentation
+ */
+
+'use strict';
+
+var ReactDOMDebugTool = require('ReactDOMDebugTool');
+
+module.exports = {debugTool: ReactDOMDebugTool};
diff --git a/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js b/src/renderers/dom/shared/devtools/ReactDOMUnknownPropertyDevtool.js
@@ -26,6 +26,9 @@ if (__DEV__) {
   var warnedProperties = {};
 
   var warnUnknownProperty = function(name) {
+    if (DOMProperty.properties.hasOwnProperty(name) || DOMProperty.isCustomAttribute(name)) {
+      return;
+    }
     if (reactProps.hasOwnProperty(name) && reactProps[name] ||
         warnedProperties.hasOwnProperty(name) && warnedProperties[name]) {
       return;
@@ -69,20 +72,16 @@ if (__DEV__) {
   };
 }
 
-class ReactDOMUnknownPropertyDevtool {
-  handleEvent(eventName, eventData) {
-    switch (eventName) {
-      case 'createMarkupForProperty':
-      case 'setValueForProperty':
-      case 'deleteValueForProperty':
-        var name = eventData.name;
-        if (!DOMProperty.properties.hasOwnProperty(name) &&
-            !DOMProperty.isCustomAttribute(name)) {
-          warnUnknownProperty(name);
-        }
-        break;
-    }
-  }
+var ReactDOMUnknownPropertyDevtool = {
+  onCreateMarkupForProperty(name, value) {
+    warnUnknownProperty(name);
+  },
+  onSetValueForProperty(node, name, value) {
+    warnUnknownProperty(name);
+  },
+  onDeleteValueForProperty(node, name) {
+    warnUnknownProperty(name);
+  },
 }
 
 module.exports = ReactDOMUnknownPropertyDevtool;