3.11 (#1000)

* Update to 3.11 * Try out 3.11 features in Object Inspector
emberjs · Aug 16, 2019 · c911905 · c911905
1 parent bd90b6a
commit c911905
Show file tree

Hide file tree

Showing 12 changed files with 911 additions and 902 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -40,8 +40,7 @@ module.exports = {
         'server/**/*.js'
       ],
       parserOptions: {
-        sourceType: 'script',
-        ecmaVersion: 2015
+        sourceType: 'script'
       },
       env: {
         browser: false,

diff --git a/app/components/mixin-detail.js b/app/components/mixin-detail.js
@@ -1,4 +1,4 @@
-import { computed } from '@ember/object';
+import { action, computed } from '@ember/object';
 import Component from '@ember/component';
 import { readOnly, sort } from '@ember/object/computed';
 
@@ -13,7 +13,7 @@ export default Component.extend({
 
   objectId: readOnly('mixinDetails.model.objectId'),
 
-  isExpanded: computed('model.expand', 'model.properties.length', function() {
+  isExpanded: computed('model.expand', 'model.properties.length', function () {
     return this.get('model.expand') && this.get('model.properties.length') > 0;
   }),
 
@@ -37,31 +37,31 @@ export default Component.extend({
     this.sortProperties = ['name'];
   },
 
-  actions: {
-    calculate({ name }) {
-      let objectId = this.get('objectId');
-      let mixinIndex = this.get('mixinDetails.model.mixins').indexOf(this.get('model'));
+  toggleExpanded: action(function () {
+    this.toggleProperty('model.expand');
+  }),
 
-      this.get('port').send('objectInspector:calculate', {
-        objectId,
-        mixinIndex,
-        property: name
-      });
-    },
+  sendToConsole: action(function ({ name }) {
+    let objectId = this.get('objectId');
 
-    sendToConsole({ name }) {
-      let objectId = this.get('objectId');
+    this.get('port').send('objectInspector:sendToConsole', {
+      objectId,
+      property: name
+    });
+  }),
 
-      this.get('port').send('objectInspector:sendToConsole', {
-        objectId,
-        property: name
-      });
-    },
+  calculate: action(function ({ name }) {
+    let objectId = this.get('objectId');
+    let mixinIndex = this.get('mixinDetails.model.mixins').indexOf(this.get('model'));
 
-    toggleExpanded() {
-      this.toggleProperty('model.expand');
-    },
+    this.get('port').send('objectInspector:calculate', {
+      objectId,
+      mixinIndex,
+      property: name
+    });
+  }),
 
+  actions: {
     digDeeper({ name }) {
       let objectId = this.get('objectId');
 

diff --git a/app/components/mixin-details.js b/app/components/mixin-details.js
@@ -1,5 +1,5 @@
 import Component from '@ember/component';
-import { computed } from '@ember/object';
+import { action, computed } from '@ember/object';
 import { sort } from '@ember/object/computed';
 
 export default Component.extend({
@@ -11,9 +11,9 @@ export default Component.extend({
    */
   sortedAllProperties: sort('allProperties', 'sortProperties'),
 
-  allProperties: computed('model', function() {
-    const props = this.get('model.mixins').map(function(mixin) {
-      return mixin.properties.filter(function(p) {
+  allProperties: computed('model', function () {
+    const props = this.get('model.mixins').map(function (mixin) {
+      return mixin.properties.filter(function (p) {
         return !p.hasOwnProperty('overridden');
       });
     });
@@ -33,11 +33,9 @@ export default Component.extend({
     this.sortProperties = ['name'];
   },
 
-  actions: {
-    traceErrors() {
-      this.get('port').send('objectInspector:traceErrors', {
-        objectId: this.get('model.objectId')
-      });
-    }
-  }
+  traceErrors: action(function () {
+    this.get('port').send('objectInspector:traceErrors', {
+      objectId: this.get('model.objectId')
+    });
+  }),
 });
diff --git a/app/components/mixin-property.js b/app/components/mixin-property.js
@@ -1,4 +1,4 @@
-import { computed } from '@ember/object';
+import { action, computed } from '@ember/object';
 import Component from '@ember/component';
 import { equal, alias, and } from '@ember/object/computed';
 import { next } from '@ember/runloop';
@@ -20,7 +20,7 @@ export default Component.extend({
   txtValue: null,
   dateValue: null,
 
-  isCalculated: computed('valueType', function() {
+  isCalculated: computed('valueType', function () {
     return this.get('valueType') !== 'type-descriptor';
   }),
 
@@ -46,41 +46,42 @@ export default Component.extend({
 
   showDependentKeys: and('isDepsExpanded', 'hasDependentKeys'),
 
-  actions: {
-    toggleDeps() {
-      this.toggleProperty('isDepsExpanded');
-    },
-    valueClick() {
-      if (this.get('isEmberObject') || this.get('isArray')) {
-        this.get('mixin').send('digDeeper', this.get('model'));
-        return;
-      }
+  toggleDeps: action(function () {
+    this.toggleProperty('isDepsExpanded');
+  }),
 
-      if (this.get('isComputedProperty') && !this.get('isCalculated')) {
-        this.get('mixin').send('calculate', this.get('model'));
-        return;
-      }
+  valueClick: action(function () {
+    if (this.get('isEmberObject') || this.get('isArray')) {
+      this.get('mixin').send('digDeeper', this.get('model'));
+      return;
+    }
 
-      if (this.get('isFunction') || this.get('model.overridden') || this.get('model.readOnly')) {
-        return;
-      }
+    if (this.get('isComputedProperty') && !this.get('isCalculated')) {
+      this.get('mixin').send('calculate', this.get('model'));
+      return;
+    }
 
-      let value = this.get('model.value.inspect');
-      let type = this.get('valueType');
-      if (type === 'type-string') {
-        // If the value is not already wrapped in quotes, wrap it
-        if (!value.startsWith('"') && !value.endsWith('"')) {
-          value = `"${value}"`;
-        }
-      }
-      if (!this.get('isDate')) {
-        this.set('txtValue', value);
-      } else {
-        this.set('dateValue', new Date(value));
+    if (this.get('isFunction') || this.get('model.overridden') || this.get('model.readOnly')) {
+      return;
+    }
+
+    let value = this.get('model.value.inspect');
+    let type = this.get('valueType');
+    if (type === 'type-string') {
+      // If the value is not already wrapped in quotes, wrap it
+      if (!value.startsWith('"') && !value.endsWith('"')) {
+        value = `"${value}"`;
       }
-      this.set('isEdit', true);
-    },
+    }
+    if (!this.get('isDate')) {
+      this.set('txtValue', value);
+    } else {
+      this.set('dateValue', new Date(value));
+    }
+    this.set('isEdit', true);
+  }),
 
+  actions: {
     saveProperty() {
       let realValue, dataType;
       if (!this.get('isDate')) {

diff --git a/app/components/object-inspector.js b/app/components/object-inspector.js
@@ -1,5 +1,5 @@
 import Component from '@ember/component';
-import { computed, get } from '@ember/object';
+import { action, computed, get } from '@ember/object';
 export default Component.extend({
   tagName: '',
 
@@ -14,32 +14,30 @@ export default Component.extend({
 
   propDisplayType: 'grouped',
 
-  trail: computed('model.[]', function() {
+  trail: computed('model.[]', function () {
     let nested = this.get('model').slice(1);
     if (nested.length === 0) { return ""; }
     return `.${nested.mapBy('property').join(".")}`;
   }),
 
-  isNested: computed('model.[]', function() {
+  isNested: computed('model.[]', function () {
     return this.get('model.length') > 1;
   }),
 
-  actions: {
-    popStack() {
-      if (this.get('isNested')) {
-        this.get('application').popMixinDetails();
-      }
-    },
+  setPropDisplay: action(function (type) {
+    this.set('propDisplayType', type);
+  }),
 
-    sendObjectToConsole(obj) {
-      let objectId = get(obj, 'objectId');
-      this.get('port').send('objectInspector:sendToConsole', {
-        objectId
-      });
-    },
+  sendObjectToConsole: action(function (obj) {
+    let objectId = get(obj, 'objectId');
+    this.get('port').send('objectInspector:sendToConsole', {
+      objectId
+    });
+  }),
 
-    setPropDisplay(type) {
-      this.set('propDisplayType', type);
+  popStack: action(function () {
+    if (this.get('isNested')) {
+      this.get('application').popMixinDetails();
     }
-  }
+  }),
 });
diff --git a/app/components/property-field.js b/app/components/property-field.js
@@ -9,7 +9,7 @@ export default TextField.extend({
    * @property propertyComponent
    * @type {Ember.Component}
    */
-  properyComponent: null,
+  propertyComponent: null,
 
   didInsertElement() {
     this.element.select();

diff --git a/app/templates/components/mixin-details.hbs b/app/templates/components/mixin-details.hbs
@@ -4,7 +4,7 @@
       Errors
       <button
         class="send-to-console send-to-console--chevron-only js-send-errors-to-console"
-        {{action "traceErrors"}}
+        {{on "click" this.traceErrors}}
       >
         {{svg-jar "send-with-chevron" width="6px" height="9px"}}
         Trace in the Console
@@ -29,7 +29,7 @@
         {{#if mixin.model.properties.length}}
           <h2
             class="mixin__name js-object-detail-name"
-            {{action "toggleExpanded" target=mixin}}
+            {{on "click" (fn mixin.toggleExpanded)}}
           >
             {{mixin.model.name}}
           </h2>

diff --git a/app/templates/components/mixin-property.hbs b/app/templates/components/mixin-property.hbs
@@ -5,7 +5,7 @@
   {{#if hasDependentKeys}}
     <button
       class="mixin__cp-toggle {{if showDependentKeys "mixin__cp-toggle--expanded"}}"
-      {{action "toggleDeps"}}
+      {{on "click" this.toggleDeps}}
     >
       {{svg-jar
         "disclosure-triangle"
@@ -30,7 +30,7 @@
     <span
       class="mixin__property-icon-container"
       title={{if model.code model.code "code not avaliable"}}
-      {{action "toggleDeps"}}
+      {{on "click" this.toggleDeps}}
     >
       <span class="mixin__property-icon mixin__property-icon--computed"></span>
     </span>
@@ -92,14 +92,14 @@
       <button
         class="mixin__calc-btn js-calculate"
         title="compute property"
-        {{action "calculate" model bubbles=false target=mixin}}
+        {{on "click" (fn mixin.calculate model) bubbles=false}}
       >
         {{svg-jar "calculate" width="16px" height="16px"}}
       </button>
     {{else}}
       <span
         class="{{model.value.type}} {{if isService "type-service"}} mixin__property-value js-object-property-value"
-        {{action "valueClick" model}}
+        {{on "click" (fn this.valueClick model)}}
       >
         {{model.value.inspect}}
       </span>
@@ -111,7 +111,7 @@
   <button
     class="mixin__send-btn send-to-console js-send-to-console-btn"
     title="Send to console"
-    {{action "sendToConsole" model target=mixin}}
+    {{on "click" (fn mixin.sendToConsole model)}}
   >
     {{svg-jar "send-with-text" width="20px" height="10px"}}
   </button>

diff --git a/app/templates/components/object-inspector.hbs b/app/templates/components/object-inspector.hbs
@@ -3,7 +3,7 @@
     <div class="toolbar">
       <button
         class="toolbar__icon-button {{if isNested "enabled" "disabled"}} js-object-inspector-back"
-        {{action "popStack"}}
+        {{on "click" this.popStack}}
       >
         {{svg-jar "arrow-back" width="21px" height="21px"}}
       </button>
@@ -15,7 +15,7 @@
       <button
         class="send-to-console js-send-object-to-console-btn"
         title="Send to Console"
-        {{action "sendObjectToConsole" model.firstObject}}
+        {{on "click" (fn this.sendObjectToConsole model.firstObject)}}
       >
         {{svg-jar "send-with-text" width="20px" height="10px"}}
       </button>
@@ -30,13 +30,13 @@
     <div class="toolbar object-inspector-toolbar">
       <button
         class="toolbar__radio toolbar__radio--first js-object-display-type-grouped {{if (eq propDisplayType "grouped") "active"}}"
-        {{action "setPropDisplay" "grouped"}}
+        {{on "click" (fn this.setPropDisplay "grouped")}}
       >
         Grouped
       </button>
       <button
         class="toolbar__radio js-object-display-type-all {{if (eq propDisplayType "all") "active"}}"
-        {{action "setPropDisplay" "all"}}
+        {{on "click" (fn this.setPropDisplay "all")}}
       >
         All
       </button>

diff --git a/app/templates/libraries-toolbar.hbs b/app/templates/libraries-toolbar.hbs
@@ -0,0 +1 @@
+<div class="toolbar"></div>
diff --git a/package.json b/package.json
@@ -49,7 +49,7 @@
     "codeclimate-test-reporter": "^0.5.1",
     "compare-versions": "^3.5.0",
     "del": "^4.1.1",
-    "ember-cli": "~3.10.1",
+    "ember-cli": "~3.11.0",
     "ember-cli-app-version": "^3.2.0",
     "ember-cli-babel": "^7.7.3",
     "ember-cli-code-coverage": "^1.0.0-beta.8",
@@ -76,7 +76,7 @@
     "ember-maybe-import-regenerator": "^0.1.6",
     "ember-qunit": "^4.4.1",
     "ember-resolver": "^5.0.1",
-    "ember-source": "~3.10.0",
+    "ember-source": "~3.11.1",
     "ember-source-channel-url": "^1.1.0",
     "ember-svg-jar": "^1.2.2",
     "ember-table": "^2.1.0",