Remove gets and access props directly (#2623)

Author: RobbieTheWagner

app/controllers/application.js

@@ -187,7 +187,7 @@ export default class ApplicationController extends Controller {
         }
       });
     }
-    if (this.mixinStack.get('length') > 0) {
+    if (this.mixinStack.length > 0) {
       this.set('mixinDetails', this.mixinStack.at(-1));
     } else {
       this.set('mixinDetails', null);

app/controllers/promise-tree.js renamed to app/controllers/promise-tree.ts

@@ -1,50 +1,59 @@
 import { action } from '@ember/object';
 import Controller from '@ember/controller';
 import { inject as service } from '@ember/service';
-import { isEmpty } from '@ember/utils';
 import { debounce, next, once } from '@ember/runloop';
 import { tracked } from '@glimmer/tracking';
 
 // eslint-disable-next-line ember/no-observers
+// @ts-expect-error We should move away from observers.
 import { observes } from '@ember-decorators/object';
 
+import type PortService from '../services/port';
+import type PromiseModel from '../models/promise';
+import type WebExtension from '../services/adapters/web-extension';
+import { isNullish } from 'ember-inspector/utils/nullish';
+
 export default class PromiseTreeController extends Controller {
   queryParams = ['filter'];
 
-  @service adapter;
-  @service port;
+  declare model: Array<PromiseModel>;
+
+  @service declare adapter: WebExtension;
+  @service declare port: PortService;
 
-  @tracked createdAfter = null;
+  @tracked createdAfter: Date | null = null;
+  @tracked effectiveSearch: string | null = null;
   @tracked filter = 'all';
-  @tracked searchValue = null;
-  @tracked effectiveSearch = null;
+  // Keep track of promise stack traces.
+  // It is opt-in due to performance reasons.
+  @tracked instrumentWithStack = false;
+  @tracked searchValue: string | null = null;
 
   // below used to show the "refresh" message
   get isEmpty() {
     return this.model.length === 0;
   }
-  get wasCleared() {
-    return Boolean(this.createdAfter);
-  }
+
   get neverCleared() {
     return !this.wasCleared;
   }
+
   get shouldRefresh() {
     return this.isEmpty && this.neverCleared;
   }
 
-  // Keep track of promise stack traces.
-  // It is opt-in due to performance reasons.
-  @tracked instrumentWithStack = false;
+  get wasCleared() {
+    return Boolean(this.createdAfter);
+  }
 
   get filtered() {
     return this.model.filter((item) => {
       // exclude cleared promises
-      if (this.createdAfter && item.get('createdAt') < this.createdAfter) {
+      if (this.createdAfter && item.createdAt < this.createdAfter) {
         return false;
       }
 
-      if (!item.get('isVisible')) {
+      if (!item.isVisible) {
         return false;
       }
 
@@ -53,11 +62,11 @@ export default class PromiseTreeController extends Controller {
       // then they pass
       let include = true;
       if (this.filter === 'pending') {
-        include = item.get('pendingBranch');
+        include = item.pendingBranch;
       } else if (this.filter === 'rejected') {
-        include = item.get('rejectedBranch');
+        include = item.rejectedBranch;
       } else if (this.filter === 'fulfilled') {
-        include = item.get('fulfilledBranch');
+        include = item.fulfilledBranch;
       }
       if (!include) {
         return false;
@@ -67,7 +76,7 @@ export default class PromiseTreeController extends Controller {
       // If they or at least one of their children
       // match the search, then include them
       let search = this.effectiveSearch;
-      if (!isEmpty(search)) {
+      if (!isNullish(search)) {
         return item.matches(search);
       }
       return true;
@@ -89,51 +98,48 @@ export default class PromiseTreeController extends Controller {
   }
 
   @action
-  toggleExpand(promise) {
-    let isExpanded = !promise.get('isExpanded');
-    promise.set('isManuallyExpanded', isExpanded);
+  toggleExpand(promise: PromiseModel) {
+    let isExpanded = !promise.isExpanded;
+    promise.isManuallyExpanded = isExpanded;
     promise.recalculateExpanded();
     let children = promise._allChildren();
     if (isExpanded) {
       children.forEach((child) => {
-        let isManuallyExpanded = child.get('isManuallyExpanded');
-        if (isManuallyExpanded === undefined) {
-          child.set('isManuallyExpanded', isExpanded);
+        if (isNullish(child.isManuallyExpanded)) {
+          child.isManuallyExpanded = isExpanded;
           child.recalculateExpanded();
         }
       });
     }
   }
 
   @action
-  tracePromise(promise) {
-    this.port.send('promise:tracePromise', { promiseId: promise.get('guid') });
+  tracePromise(promise: PromiseModel) {
+    this.port.send('promise:tracePromise', { promiseId: promise.guid });
   }
 
   @action
   inspectObject() {
+    // @ts-expect-error TODO: figure this out later
     this.target.send('inspectObject', ...arguments);
   }
 
   @action
-  sendValueToConsole(promise) {
+  sendValueToConsole(promise: PromiseModel) {
     this.port.send('promise:sendValueToConsole', {
-      promiseId: promise.get('guid'),
+      promiseId: promise.guid,
     });
   }
 
   @action
-  setFilter(filter) {
+  setFilter(filter: string) {
     this.filter = filter;
-    next(() => {
-      this.notifyPropertyChange('filtered');
-    });
   }
 
   @action
-  updateInstrumentWithStack(bool) {
+  updateInstrumentWithStack(instrumentWithStack: boolean) {
     this.port.send('promise:setInstrumentWithStack', {
-      instrumentWithStack: bool,
+      instrumentWithStack,
     });
   }
 

app/models/promise.ts

@@ -39,7 +39,7 @@ export default class PromiseModel extends EmberObject {
 
   @tracked branchLabel = '';
   @tracked isExpanded = false;
-  @tracked isManuallyExpanded = undefined;
+  @tracked isManuallyExpanded?: boolean = undefined;
   @tracked parent: PromiseModel | null = null;
 
   get level(): number {

app/routes/application.js

@@ -1,3 +1,4 @@
+/* eslint-disable ember/no-controller-access-in-routes */
 import { inject as service } from '@ember/service';
 import { action, set } from '@ember/object';
 import Route from '@ember/routing/route';
@@ -54,7 +55,6 @@ export default class ApplicationRoute extends Route {
     NativeArray.apply(details);
     details.forEach(arrayize);
 
-    // eslint-disable-next-line ember/no-controller-access-in-routes
     let controller = this.controller;
 
     if (options.parentObject) {
@@ -63,22 +63,16 @@ export default class ApplicationRoute extends Route {
       controller.activateMixinDetails(name, objectId, details, errors);
     }
 
-    // eslint-disable-next-line ember/no-controller-access-in-routes
     this.controller.showInspector();
   }
 
   setDeprecationCount(message) {
-    // eslint-disable-next-line ember/no-controller-access-in-routes
     this.controller.set('deprecationCount', message.count);
   }
 
-  // eslint-enable ember/no-controller-access-in-routes
-
   updateProperty(options) {
-    if (this.get('controller.mixinDetails.mixins')) {
-      const detail = this.get('controller.mixinDetails.mixins').at(
-        options.mixinIndex,
-      );
+    if (this.controller.mixinDetails?.mixins) {
+      const detail = this.controller.mixinDetails.mixins.at(options.mixinIndex);
       let property = detail.properties.find((x) => x.name === options.property);
       if (!property) return;
       set(property, 'value', options.value);
@@ -89,7 +83,8 @@ export default class ApplicationRoute extends Route {
   }
 
   updateErrors(options) {
-    let mixinDetails = this.get('controller.mixinDetails');
+    let mixinDetails = this.controller.mixinDetails;
+
     if (mixinDetails) {
       if (mixinDetails.objectId === options.objectId) {
         set(mixinDetails, 'errors', options.errors);
@@ -98,7 +93,6 @@ export default class ApplicationRoute extends Route {
   }
 
   droppedObject(message) {
-    // eslint-disable-next-line ember/no-controller-access-in-routes
     this.controller.droppedObject(message.objectId);
   }
 

app/services/port.ts

@@ -13,7 +13,9 @@ export interface Message {
   applicationName: string;
   frameId?: any;
   from: string;
+  instrumentWithStack?: boolean;
   name?: string;
+  promiseId?: string;
   shouldHighlightRender?: boolean;
   tabId?: number;
   type: string;

tests/ember_debug/object-inspector-test.js

@@ -648,7 +648,7 @@ module('Ember Debug - Object Inspector', function (hooks) {
       });
     });
 
-    assert.strictEqual(inspected.get('name'), 'Alex');
+    assert.strictEqual(inspected.name, 'Alex');
 
     assert.strictEqual(message.property, 'name');
     assert.strictEqual(message.value.inspect, inspect('Alex'));
@@ -674,9 +674,9 @@ module('Ember Debug - Object Inspector', function (hooks) {
       });
     });
 
-    assert.strictEqual(inspected.get('date').getFullYear(), 2015);
-    assert.strictEqual(inspected.get('date').getMonth(), 0);
-    assert.strictEqual(inspected.get('date').getDate(), 1);
+    assert.strictEqual(inspected.date.getFullYear(), 2015);
+    assert.strictEqual(inspected.date.getMonth(), 0);
+    assert.strictEqual(inspected.date.getDate(), 1);
 
     assert.strictEqual(message.property, 'date');
     assert.strictEqual(message.value.inspect, inspect(newDate));

tests/ember_debug/promise-assembler-test.js

@@ -55,7 +55,7 @@ module('Ember Debug - PromiseAssembler', function (hooks) {
     let promise = event.promise;
     assert.strictEqual(event.promise, assembler.find(promise['guid']));
 
-    assert.strictEqual(assembler.find().get('length'), 1);
+    assert.strictEqual(assembler.find().length, 1);
 
     assert.strictEqual(promise['guid'], 1);
     assert.strictEqual(promise['label'], 'label');
@@ -88,7 +88,7 @@ module('Ember Debug - PromiseAssembler', function (hooks) {
     assert.strictEqual(assembler.find(parent['guid']), parent);
     assert.strictEqual(assembler.find(child['guid']), child);
 
-    assert.strictEqual(assembler.find().get('length'), 2);
+    assert.strictEqual(assembler.find().length, 2);
 
     assert.strictEqual(parent['guid'], 1);
     assert.strictEqual(parent['label'], 'label');
@@ -147,7 +147,7 @@ module('Ember Debug - PromiseAssembler', function (hooks) {
     assert.strictEqual(assembler.find(parent['guid']), parent);
     assert.strictEqual(assembler.find(child['guid']), child);
 
-    assert.strictEqual(assembler.find().get('length'), 2);
+    assert.strictEqual(assembler.find().length, 2);
 
     assert.strictEqual(parent['guid'], 1);
     assert.strictEqual(parent['label'], 'label');
@@ -230,7 +230,7 @@ module('Ember Debug - PromiseAssembler', function (hooks) {
     assert.strictEqual(promise['state'], 'rejected');
     assert.strictEqual(promise['reason'], 'reason');
     assert.strictEqual(promise['settledAt'], date);
-    assert.strictEqual(assembler.find().get('length'), 1);
+    assert.strictEqual(assembler.find().length, 1);
   });
 
   test('#stop', function (assert) {
@@ -239,15 +239,15 @@ module('Ember Debug - PromiseAssembler', function (hooks) {
     fakeRSVP.trigger('created', {
       guid: 1,
     });
-    assert.strictEqual(assembler.find().get('length'), 1);
+    assert.strictEqual(assembler.find().length, 1);
 
     run(assembler, 'stop');
 
-    assert.strictEqual(assembler.find().get('length'), 0);
+    assert.strictEqual(assembler.find().length, 0);
     assembler.on('created', function () {
       assert.ok(false);
     });
     fakeRSVP.trigger('created', { guid: 1 });
-    assert.strictEqual(assembler.find().get('length'), 0);
+    assert.strictEqual(assembler.find().length, 0);
   });
 });