ember-inspector 4.13.1-alpha.2024.8.9 → 4.13.1-alpha.2025.10.2

package/app/routes/deprecations.js

@@ -1,6 +1,6 @@
 import { inject as service } from '@ember/service';
 import { Promise } from 'rsvp';
-import { action, setProperties } from '@ember/object';
+import { setProperties } from '@ember/object';
 import TabRoute from 'ember-inspector/routes/tab';
 
 export default class DeprecationsRoute extends TabRoute {
@@ -32,30 +32,21 @@ export default class DeprecationsRoute extends TabRoute {
     this.port.off(
       'deprecation:deprecationsAdded',
       this,
-      this.deprecationsAdded
+      this.deprecationsAdded,
     );
   }
 
   deprecationsAdded(message) {
-    // eslint-disable-next-line ember/no-controller-access-in-routes
-    let { deprecations } = this.controller;
-
     message.deprecations.forEach((item) => {
-      let record = deprecations.findBy('id', item.id);
+      let record = this.controller.deprecations.find(
+        (deprecation) => deprecation.id === item.id,
+      );
+
       if (record) {
         setProperties(record, item);
       } else {
-        deprecations.pushObject(item);
+        this.controller.deprecations.push(item);
       }
     });
   }
-
-  @action
-  clear() {
-    // eslint-disable-next-line ember/no-controller-access-in-routes
-    let { deprecations } = this.controller;
-
-    this.port.send('deprecation:clear');
-    deprecations.clear();
-  }
 }

package/app/routes/launch.js

@@ -1,4 +1,5 @@
 import { inject as service } from '@ember/service';
+// eslint-disable-next-line ember/no-computed-properties-in-native-classes
 import { readOnly } from '@ember/object/computed';
 import Route from '@ember/routing/route';
 import RSVP from 'rsvp';
@@ -54,7 +55,7 @@ export default class LaunchRoute extends Route {
           },
           function () {
             resolve();
-          }
+          },
         );
       });
     } else {

package/app/routes/libraries.js

@@ -1,4 +1,5 @@
 import { inject as service } from '@ember/service';
+// eslint-disable-next-line ember/no-computed-properties-in-native-classes
 import { readOnly } from '@ember/object/computed';
 import { Promise } from 'rsvp';
 import TabRoute from 'ember-inspector/routes/tab';
@@ -14,7 +15,7 @@ export default class LibrariesRoute extends TabRoute {
     const port = this.port;
     return new Promise((resolve) => {
       port.one('general:libraries', (message) => {
-        message.libraries.insertAt(0, {
+        message.libraries.splice(0, 0, {
           name: 'Ember Inspector',
           version,
         });

package/app/routes/model-type.js

@@ -7,9 +7,8 @@ export default class ModelTypeRoute extends Route {
 
   model(params) {
     return new Promise((resolve) => {
-      const type = this.modelFor('model-types').findBy(
-        'name',
-        decodeURIComponent(params.type_id)
+      const type = this.modelFor('model-types').find(
+        (x) => x.name === decodeURIComponent(params.type_id),
       );
       if (type) {
         resolve(type);

package/app/routes/model-types.ts

@@ -0,0 +1,57 @@
+import type Controller from '@ember/controller';
+import { inject as service } from '@ember/service';
+import { set } from '@ember/object';
+import type Transition from '@ember/routing/transition';
+
+import { TrackedArray } from 'tracked-built-ins';
+
+import type PortService from '../services/port';
+import TabRoute from '../routes/tab';
+import type { Message, ModelType } from '../services/port';
+
+export default class ModelTypesRoute extends TabRoute {
+  @service declare port: PortService;
+
+  model() {
+    return new Promise<TrackedArray<ModelType>>((resolve) => {
+      this.port.one('data:modelTypesAdded', function (message: Message) {
+        resolve(new TrackedArray(message.modelTypes));
+      });
+      this.port.send('data:getModelTypes');
+    });
+  }
+
+  setupController(
+    controller: Controller,
+    model: unknown,
+    transition: Transition,
+  ) {
+    super.setupController(controller, model, transition);
+
+    this.port.on('data:modelTypesAdded', this, this.addModelTypes);
+    this.port.on('data:modelTypesUpdated', this, this.updateModelTypes);
+  }
+
+  deactivate() {
+    this.port.off('data:modelTypesAdded', this, this.addModelTypes);
+    this.port.off('data:modelTypesUpdated', this, this.updateModelTypes);
+    this.port.send('data:releaseModelTypes');
+  }
+
+  get _currentModel(): Array<ModelType> {
+    return this.modelFor(this.routeName) as Array<ModelType>;
+  }
+
+  addModelTypes = (message: Message) => {
+    this._currentModel.push(...message.modelTypes);
+  };
+
+  updateModelTypes = (message: Message) => {
+    message.modelTypes.forEach((modelType) => {
+      const currentType = this._currentModel.find(
+        (x) => x.objectId === modelType.objectId,
+      );
+      set(currentType as ModelType, 'count', modelType.count);
+    });
+  };
+}

package/app/routes/promise-tree.ts

@@ -0,0 +1,63 @@
+import { inject as service } from '@ember/service';
+import { Promise } from 'rsvp';
+import type Transition from '@ember/routing/transition';
+
+import PromiseAssembler from '../libs/promise-assembler';
+import type PortService from '../services/port';
+import TabRoute from '../routes/tab';
+import type PromiseTreeController from '../controllers/promise-tree';
+
+export default class PromiseTreeRoute extends TabRoute {
+  @service declare port: PortService;
+
+  assembler: PromiseAssembler;
+  declare controller: PromiseTreeController;
+
+  constructor() {
+    // eslint-disable-next-line prefer-rest-params
+    super(...arguments);
+
+    this.assembler = PromiseAssembler.create({
+      port: this.port,
+    });
+  }
+
+  model() {
+    // block rendering until first batch arrives
+    // Helps prevent flashing of "please refresh the page"
+    return new Promise((resolve) => {
+      this.assembler.one('firstMessageReceived', () => {
+        resolve(this.assembler.topSort);
+      });
+      this.assembler.start();
+    });
+  }
+
+  setupController(
+    controller: PromiseTreeController,
+    model: unknown,
+    transition: Transition,
+  ) {
+    super.setupController(controller, model, transition);
+
+    this.port.on(
+      'promise:instrumentWithStack',
+      this,
+      this.setInstrumentWithStack,
+    );
+    this.port.send('promise:getInstrumentWithStack');
+  }
+
+  deactivate() {
+    this.assembler.stop();
+    this.port.off(
+      'promise:instrumentWithStack',
+      this,
+      this.setInstrumentWithStack,
+    );
+  }
+
+  setInstrumentWithStack = (message: { instrumentWithStack: boolean }) => {
+    this.controller.instrumentWithStack = message.instrumentWithStack;
+  };
+}

package/app/routes/records.ts

@@ -0,0 +1,78 @@
+import type Controller from '@ember/controller';
+import type Transition from '@ember/routing/transition';
+import { inject as service } from '@ember/service';
+import { set } from '@ember/object';
+
+import { TrackedArray } from 'tracked-built-ins';
+
+import type PortService from '../services/port';
+import type { Message, ModelType, RecordType } from '../services/port';
+import TabRoute from '../routes/tab';
+// @ts-expect-error TODO: not yet typed
+import type RecordsController from '../controllers/records';
+
+export default class RecordsRoute extends TabRoute {
+  @service declare port: PortService;
+
+  declare controller: RecordsController;
+
+  model() {
+    return new TrackedArray([]);
+  }
+
+  setupController(
+    controller: Controller,
+    model: unknown,
+    transition: Transition,
+  ) {
+    super.setupController(controller, model, transition);
+
+    const type = this.modelFor('model_type') as ModelType;
+
+    // @ts-expect-error TODO this should be resolved when we type the controller
+    controller.modelType = type;
+
+    this.port.on('data:recordsAdded', this, this.addRecords);
+    this.port.on('data:recordsUpdated', this, this.updateRecords);
+    this.port.on('data:recordsRemoved', this, this.removeRecords);
+    this.port.one('data:filters', this, (message: Message) => {
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+      this.controller.filters = new TrackedArray(message.filters);
+    });
+    this.port.send('data:getFilters');
+    this.port.send('data:getRecords', { objectId: type.objectId });
+  }
+
+  deactivate() {
+    this.port.off('data:recordsAdded', this, this.addRecords);
+    this.port.off('data:recordsUpdated', this, this.updateRecords);
+    this.port.off('data:recordsRemoved', this, this.removeRecords);
+    this.port.send('data:releaseRecords');
+  }
+
+  get _currentModel(): Array<RecordType> {
+    return this.modelFor(this.routeName) as Array<RecordType>;
+  }
+
+  addRecords = (message: Message) => {
+    this._currentModel.push(...message.records);
+  };
+
+  removeRecords = (message: Message) => {
+    this._currentModel.splice(message.index, message.count);
+  };
+
+  updateRecords = (message: Message) => {
+    message.records.forEach((record) => {
+      const currentRecord = this._currentModel.find(
+        (x) => x.objectId === record.objectId,
+      );
+      if (currentRecord) {
+        set(currentRecord, 'columnValues', record.columnValues);
+        set(currentRecord, 'filterValues', record.filterValues);
+        set(currentRecord, 'searchIndex', record.searchIndex);
+        set(currentRecord, 'color', record.color);
+      }
+    });
+  };
+}

package/app/routes/render-tree.ts

@@ -0,0 +1,93 @@
+import EmberObject, { set } from '@ember/object';
+import { inject as service } from '@ember/service';
+import { Promise } from 'rsvp';
+import type Transition from '@ember/routing/transition';
+
+import { TrackedArray } from 'tracked-built-ins';
+
+import type PortService from '../services/port';
+import type RenderTreeController from '../controllers/render-tree';
+import TabRoute from './tab';
+
+export interface Profile {
+  children: Array<Profile>;
+  name: string;
+}
+
+export interface RenderTreeModel {
+  isHighlightSupported: boolean;
+  profiles: Array<Profile>;
+}
+
+export default class RenderTreeRoute extends TabRoute {
+  @service declare port: PortService;
+
+  declare controller: RenderTreeController;
+
+  model() {
+    return new Promise((resolve) => {
+      this.port.one(
+        'render:profilesAdded',
+        function ({ profiles, isHighlightSupported }: RenderTreeModel) {
+          resolve(
+            EmberObject.create({
+              // @ts-expect-error TODO: fix this
+              profiles: new TrackedArray(profiles),
+              isHighlightSupported,
+            }),
+          );
+        },
+      );
+      this.port.send('render:watchProfiles');
+    });
+  }
+
+  setupController(
+    controller: RenderTreeController,
+    model: RenderTreeModel,
+    transition: Transition,
+  ) {
+    super.setupController(controller, model, transition);
+
+    if (model.profiles.length === 0) {
+      controller.initialEmpty = true;
+    }
+
+    this.port.on('render:profilesUpdated', this, this.profilesUpdated);
+    this.port.on('render:profilesAdded', this, this.profilesAdded);
+  }
+
+  deactivate(transition: Transition) {
+    super.deactivate(transition);
+
+    this.port.off('render:profilesUpdated', this, this.profilesUpdated);
+    this.port.off('render:profilesAdded', this, this.profilesAdded);
+    this.port.send('render:releaseProfiles');
+  }
+
+  profilesUpdated = (message: RenderTreeModel) => {
+    set(this.controller.model, 'profiles', message.profiles);
+  };
+
+  profilesAdded = (message: RenderTreeModel) => {
+    const currentProfiles = this.controller.model.profiles;
+    const profiles = message.profiles;
+    if (
+      message.isHighlightSupported !== undefined &&
+      message.isHighlightSupported !==
+        this.controller.model.isHighlightSupported
+    ) {
+      set(
+        this.controller.model,
+        'isHighlightSupported',
+        message.isHighlightSupported,
+      );
+    }
+
+    // @ts-expect-error TODO: fix this type error
+    currentProfiles.push(profiles);
+    if (currentProfiles.length > 100) {
+      set(this.controller.model, 'profiles', currentProfiles.slice(0, 100));
+    }
+  };
+}

package/app/routes/route-tree.js

@@ -20,7 +20,6 @@ export default class RouteTreeRoute extends TabRoute {
   }
 
   setCurrentRoute(message) {
-    // eslint-disable-next-line ember/no-controller-access-in-routes
     this.controller.set('currentRoute', message);
   }
 

package/app/routes/{tab.js → tab.ts}

@@ -1,14 +1,21 @@
+import type Controller from '@ember/controller';
 import Route from '@ember/routing/route';
 import { scheduleOnce } from '@ember/runloop';
+import type Transition from '@ember/routing/transition';
 
 export default class TabRoute extends Route {
-  setupController(controller) {
-    super.setupController(...arguments);
+  setupController(
+    controller: Controller,
+    model: unknown,
+    transition: Transition,
+  ) {
+    super.setupController(controller, model, transition);
 
     function setToolbarContainer() {
       controller.set('toolbarContainer', document.querySelector('#toolbar'));
     }
 
+    // eslint-disable-next-line ember/no-runloop
     scheduleOnce('afterRender', this, setToolbarContainer);
   }
 }

package/app/routes/whats-new.js

@@ -44,8 +44,8 @@ export default class WhatsNewRoute extends TabRoute {
 
     let ref = version.indexOf('alpha') === -1 ? `v${version}` : 'main';
     let url = `https://raw.githubusercontent.com/emberjs/ember-inspector/${encodeURIComponent(
-      ref
-    )}/CHANGELOG.md`;
+      ref,
+    )}-ember-inspector/CHANGELOG.md`;
 
     return fetch(url)
       .then(checkStatus)

package/app/services/adapters/{basic.js → basic.ts}

@@ -14,22 +14,27 @@
 import Service, { inject as service } from '@ember/service';
 import { action } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
+import type { AnyFn } from '@ember/-internals/utility-types';
 import config from 'ember-inspector/config/environment';
+import type PortService from '../port';
+import type { Message } from '../port';
 
 export default class Basic extends Service {
-  @service port;
+  @service declare port: PortService;
 
-  @tracked canOpenResource = false;
+  _messageCallbacks: Array<AnyFn>;
   name = 'basic';
 
+  @tracked canOpenResource = false;
+
   /**
    * Called when the adapter is created (when
    * the inspector app boots).
-   *
-   * @method init
    */
-  init() {
-    super.init(...arguments);
+  constructor() {
+    // eslint-disable-next-line prefer-rest-params
+    super(...arguments);
+
     this._messageCallbacks = [];
     this._checkVersion();
   }
@@ -41,20 +46,22 @@ export default class Basic extends Service {
    * Ember version and needs to switch to an inspector version
    * that does.
    *
-   * @method _checkVersion
    * @private
    */
   _checkVersion() {
-    this.onMessageReceived((message) => {
-      let { name, version } = message;
+    this.onMessageReceived((message: Message) => {
+      const { name, version } = message;
       if (name === 'version-mismatch') {
-        let previousVersions = config.previousEmberVersionsSupported;
-        let [fromVersion, tillVersion] = config.emberVersionsSupported;
+        const previousVersions = config.previousEmberVersionsSupported;
+        const [fromVersion, tillVersion] = config.emberVersionsSupported;
         let neededVersion;
 
-        if (compareVersion(version, fromVersion) === -1) {
+        if (compareVersion(version as string, fromVersion) === -1) {
           neededVersion = previousVersions[previousVersions.length - 1];
-        } else if (tillVersion && compareVersion(version, tillVersion) !== -1) {
+        } else if (
+          tillVersion &&
+          compareVersion(version as string, tillVersion) !== -1
+        ) {
           neededVersion = tillVersion;
         } else {
           return;
@@ -73,35 +80,35 @@ export default class Basic extends Service {
    * to switch to an older/new inspector version
    * that supports this Ember version.
    *
-   * @method onVersionMismatch
-   * @param {String} neededVersion (The version to go to)
+   * @param _neededVersion (The version to go to)
    */
-  onVersionMismatch() {}
+  onVersionMismatch(_neededVersion?: string) {}
 
   /**
     Used to send messages to EmberDebug
 
-    @param type {Object} the message to the send
+    @param _message the message to send
   **/
-  sendMessage() {}
+  sendMessage(_message: Partial<Message>) {}
 
   /**
     Register functions to be called
     when a message from EmberDebug is received
   **/
-  onMessageReceived(callback) {
+  onMessageReceived(callback: AnyFn) {
     this._messageCallbacks.push(callback);
   }
 
-  _messageReceived(...args) {
+  _messageReceived(...args: Array<unknown>) {
     this._messageCallbacks.forEach((callback) => {
       callback(...args);
     });
   }
 
+  reloadTab?(): void;
   // Called when the "Reload" is clicked by the user
   willReload() {}
-  openResource /* file, line */() {}
+  openResource(_file: string, _line: number) {}
 
   @action
   refreshPage() {
@@ -126,15 +133,14 @@ export default class Basic extends Service {
  * 0 if version1 == version2
  * 1 if version1 > version2
  *
- * @param {String} version1
- * @param {String} version2
- * @return {Boolean} result of the comparison
+ * @return result of the comparison
  */
-function compareVersion(version1, version2) {
-  version1 = cleanupVersion(version1).split('.');
-  version2 = cleanupVersion(version2).split('.');
+function compareVersion(version1: string, version2: string) {
+  const v1 = cleanupVersion(version1).split('.');
+  const v2 = cleanupVersion(version2).split('.');
   for (let i = 0; i < 3; i++) {
-    let compared = compare(+version1[i], +version2[i]);
+    // @ts-expect-error TODO: refactor this to make TS happy
+    const compared = compare(+v1[i], +v2[i]);
     if (compared !== 0) {
       return compared;
     }
@@ -143,11 +149,11 @@ function compareVersion(version1, version2) {
 }
 
 /* Remove -alpha, -beta, etc from versions */
-function cleanupVersion(version) {
+function cleanupVersion(version: string) {
   return version.replace(/-.*/g, '');
 }
 
-function compare(val, number) {
+function compare(val: number, number: number) {
   if (val === number) {
     return 0;
   } else if (val < number) {

package/app/services/adapters/{bookmarklet.js → bookmarklet.ts}

@@ -1,53 +1,46 @@
-/* eslint-disable no-useless-escape */
-import { computed } from '@ember/object';
-
 import BasicAdapter from './basic';
+import type { Message } from '../port';
 
 export default class Bookmarklet extends BasicAdapter {
   name = 'bookmarklet';
 
   /**
    * Called when the adapter is created.
-   *
-   * @method init
    */
-  init() {
+  constructor() {
+    // @ts-expect-error Using ...arguments is fine.
+    // eslint-disable-next-line prefer-rest-params
+    super(...arguments);
+
     this._connect();
-    return super.init(...arguments);
   }
 
-  @computed
   get inspectedWindow() {
-    return window.opener || window.parent;
+    return (window.opener as Window | undefined) || window.parent;
   }
 
-  @computed
   get inspectedWindowURL() {
     return loadPageVar('inspectedWindowURL');
   }
 
-  sendMessage(options) {
-    options = options || {};
-    this.inspectedWindow.postMessage(options, this.inspectedWindowURL);
+  sendMessage(message?: Partial<Message>) {
+    this.inspectedWindow.postMessage(message ?? {}, this.inspectedWindowURL);
   }
 
   /**
    * Redirect to the correct inspector version.
-   *
-   * @method onVersionMismatch
-   * @param {String} goToVersion
    */
-  onVersionMismatch(goToVersion) {
+  onVersionMismatch(goToVersion: string) {
     this.sendMessage({ name: 'version-mismatch', version: goToVersion });
     window.location.href = `../panes-${goToVersion.replace(
       /\./g,
-      '-'
+      '-',
     )}/index.html${window.location.search}`;
   }
 
   _connect() {
     window.addEventListener('message', (e) => {
-      let message = e.data;
+      const message = e.data as Message;
       if (e.origin !== this.inspectedWindowURL) {
         return;
       }
@@ -62,17 +55,17 @@ export default class Bookmarklet extends BasicAdapter {
   }
 }
 
-function loadPageVar(sVar) {
+function loadPageVar(sVar: string) {
   return decodeURI(
     window.location.search.replace(
       new RegExp(
         `^(?:.*[&\\?]${encodeURI(sVar).replace(
           /[\.\+\*]/g,
-          '\\$&'
+          '\\$&',
         )}(?:\\=([^&]*))?)?.*$`,
-        'i'
+        'i',
       ),
-      '$1'
-    )
+      '$1',
+    ),
   );
 }

package/app/services/adapters/{chrome.js → chrome.ts}

@@ -5,8 +5,7 @@ export default class Chrome extends WebExtension {
   name = 'chrome';
   @tracked canOpenResource = true;
 
-  openResource(file, line) {
-    /*global chrome */
+  openResource(file: string, line: number) {
     // For some reason it opens the line after the one specified
     chrome.devtools.panels.openResource(file, line - 1);
   }