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 463311 62adfbcebf9d05733760083ee4920bcc48cfebad
parent 463310 81769de2a84960e0ba8b6b432e66d37d9ceab37e
child 463312 dcc242748505f031d1ec9fddb3027d85c4868987
push id42014
push userjdescottes@mozilla.com
push dateWed, 18 Jan 2017 20:17:21 +0000
reviewersnchevobbe
bugs1315922
milestone53.0a1
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
           }, " }")
         )
       );
     }),
   });