Bug 1315922 - reps: avoid using props as variable name in react classes;r=nchevobbe
authorJulian Descottes <jdescottes@mozilla.com>
Tue, 10 Jan 2017 14:52:14 +0100
changeset 374975 62adfbcebf9d05733760083ee4920bcc48cfebad
parent 374974 81769de2a84960e0ba8b6b432e66d37d9ceab37e
child 374976 dcc242748505f031d1ec9fddb3027d85c4868987
push id6996
push userjlorenzo@mozilla.com
push dateMon, 06 Mar 2017 20:48:21 +0000
treeherdermozilla-beta@d89512dab048 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersnchevobbe
bugs1315922
milestone53.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1315922 - reps: avoid using props as variable name in react classes;r=nchevobbe MozReview-Commit-ID: 33QUPfoJRpV
devtools/client/shared/components/reps/event.js
devtools/client/shared/components/reps/object.js
--- a/devtools/client/shared/components/reps/event.js
+++ b/devtools/client/shared/components/reps/event.js
@@ -37,58 +37,59 @@ define(function (require, exports, modul
       }
       return title;
     },
 
     render: wrapRender(function () {
       // Use `Object.assign` to keep `this.props` without changes because:
       // 1. JSON.stringify/JSON.parse is slow.
       // 2. Immutable.js is planned for the future.
-      let props = Object.assign({
+      let gripProps = Object.assign({
         title: this.getTitle(this.props)
       }, this.props);
-      props.object = Object.assign({}, this.props.object);
-      props.object.preview = Object.assign({}, this.props.object.preview);
+      gripProps.object = Object.assign({}, this.props.object);
+      gripProps.object.preview = Object.assign({}, this.props.object.preview);
 
-      props.object.preview.ownProperties = {};
-      if (props.object.preview.target) {
-        Object.assign(props.object.preview.ownProperties, {
-          target: props.object.preview.target
+      gripProps.object.preview.ownProperties = {};
+      if (gripProps.object.preview.target) {
+        Object.assign(gripProps.object.preview.ownProperties, {
+          target: gripProps.object.preview.target
         });
       }
-      Object.assign(props.object.preview.ownProperties, props.object.preview.properties);
+      Object.assign(gripProps.object.preview.ownProperties,
+        gripProps.object.preview.properties);
 
-      delete props.object.preview.properties;
-      props.object.ownPropertyLength =
-        Object.keys(props.object.preview.ownProperties).length;
+      delete gripProps.object.preview.properties;
+      gripProps.object.ownPropertyLength =
+        Object.keys(gripProps.object.preview.ownProperties).length;
 
-      switch (props.object.class) {
+      switch (gripProps.object.class) {
         case "MouseEvent":
-          props.isInterestingProp = (type, value, name) => {
+          gripProps.isInterestingProp = (type, value, name) => {
             return ["target", "clientX", "clientY", "layerX", "layerY"].includes(name);
           };
           break;
         case "KeyboardEvent":
-          props.isInterestingProp = (type, value, name) => {
+          gripProps.isInterestingProp = (type, value, name) => {
             return ["target", "key", "charCode", "keyCode"].includes(name);
           };
           break;
         case "MessageEvent":
-          props.isInterestingProp = (type, value, name) => {
+          gripProps.isInterestingProp = (type, value, name) => {
             return ["target", "isTrusted", "data"].includes(name);
           };
           break;
         default:
-          props.isInterestingProp = (type, value, name) => {
+          gripProps.isInterestingProp = (type, value, name) => {
             // We want to show the properties in the order they are declared.
-            return Object.keys(props.object.preview.ownProperties).includes(name);
+            return Object.keys(gripProps.object.preview.ownProperties).includes(name);
           };
       }
 
-      return rep(props);
+      return rep(gripProps);
     })
   });
 
   // Registration
 
   function supportsObject(grip, type) {
     if (!isGrip(grip)) {
       return false;
--- a/devtools/client/shared/components/reps/object.js
+++ b/devtools/client/shared/components/reps/object.js
@@ -60,108 +60,108 @@ define(function (require, exports, modul
 
       // Work around https://bugzilla.mozilla.org/show_bug.cgi?id=945377
       if (Object.prototype.toString.call(object) === "[object Generator]") {
         object = Object.getPrototypeOf(object);
       }
 
       // Object members with non-empty values are preferred since it gives the
       // user a better overview of the object.
-      let props = this.getProps(object, max, isInterestingProp);
+      let propsArray = this.getPropsArray(object, max, isInterestingProp);
 
-      if (props.length <= max) {
+      if (propsArray.length <= max) {
         // There are not enough props yet (or at least, not enough props to
         // be able to know whether we should print "more…" or not).
         // Let's display also empty members and functions.
-        props = props.concat(this.getProps(object, max, (t, value) => {
+        propsArray = propsArray.concat(this.getPropsArray(object, max, (t, value) => {
           return !isInterestingProp(t, value);
         }));
       }
 
-      if (props.length > max) {
-        props.pop();
+      if (propsArray.length > max) {
+        propsArray.pop();
         let objectLink = this.props.objectLink || span;
 
-        props.push(Caption({
+        propsArray.push(Caption({
           object: objectLink({
             object: object
           }, (Object.keys(object).length - max) + " more…")
         }));
-      } else if (props.length > 0) {
+      } else if (propsArray.length > 0) {
         // Remove the last comma.
-        props[props.length - 1] = React.cloneElement(
-          props[props.length - 1], { delim: "" });
+        propsArray[propsArray.length - 1] = React.cloneElement(
+          propsArray[propsArray.length - 1], { delim: "" });
       }
 
-      return props;
+      return propsArray;
     },
 
-    getProps: function (object, max, filter) {
-      let props = [];
+    getPropsArray: function (object, max, filter) {
+      let propsArray = [];
 
       max = max || 3;
       if (!object) {
-        return props;
+        return propsArray;
       }
 
       // Hardcode tiny mode to avoid recursive handling.
       let mode = MODE.TINY;
 
       try {
         for (let name in object) {
-          if (props.length > max) {
-            return props;
+          if (propsArray.length > max) {
+            return propsArray;
           }
 
           let value;
           try {
             value = object[name];
           } catch (exc) {
             continue;
           }
 
           let t = typeof value;
           if (filter(t, value)) {
-            props.push(PropRep({
+            propsArray.push(PropRep({
               mode: mode,
               name: name,
               object: value,
               equal: ": ",
               delim: ", ",
             }));
           }
         }
       } catch (err) {
         console.error(err);
       }
 
-      return props;
+      return propsArray;
     },
 
     render: wrapRender(function () {
       let object = this.props.object;
-      let props = this.safePropIterator(object);
+      let propsArray = this.safePropIterator(object);
       let objectLink = this.props.objectLink || span;
 
-      if (this.props.mode === MODE.TINY || !props.length) {
+      if (this.props.mode === MODE.TINY || !propsArray.length) {
         return (
           span({className: "objectBox objectBox-object"},
             objectLink({className: "objectTitle"}, this.getTitle(object))
           )
         );
       }
 
       return (
         span({className: "objectBox objectBox-object"},
           this.getTitle(object),
           objectLink({
             className: "objectLeftBrace",
             object: object
           }, " { "),
-          ...props,
+          ...propsArray,
           objectLink({
             className: "objectRightBrace",
             object: object
           }, " }")
         )
       );
     }),
   });