ember-inspector 4.13.1-alpha.2024.8.8 → 4.13.1-alpha.2025.6.7

package/tests/helpers/{index.js → index.ts}

@@ -2,13 +2,14 @@ import {
   setupApplicationTest as upstreamSetupApplicationTest,
   setupRenderingTest as upstreamSetupRenderingTest,
   setupTest as upstreamSetupTest,
+  type SetupTestOptions,
 } from 'ember-qunit';
 
-// This file exists to provide wrappers around ember-qunit's / ember-mocha's
+// This file exists to provide wrappers around ember-qunit's
 // test setup functions. This way, you can easily extend the setup that is
 // needed per test type.
 
-function setupApplicationTest(hooks, options) {
+function setupApplicationTest(hooks: NestedHooks, options?: SetupTestOptions) {
   upstreamSetupApplicationTest(hooks, options);
 
   // Additional setup for application tests can be done here.
@@ -23,17 +24,17 @@ function setupApplicationTest(hooks, options) {
   // This is also a good place to call test setup functions coming
   // from other addons:
   //
-  // setupIntl(hooks); // ember-intl
+  // setupIntl(hooks, 'en-us'); // ember-intl
   // setupMirage(hooks); // ember-cli-mirage
 }
 
-function setupRenderingTest(hooks, options) {
+function setupRenderingTest(hooks: NestedHooks, options?: SetupTestOptions) {
   upstreamSetupRenderingTest(hooks, options);
 
   // Additional setup for rendering tests can be done here.
 }
 
-function setupTest(hooks, options) {
+function setupTest(hooks: NestedHooks, options?: SetupTestOptions) {
   upstreamSetupTest(hooks, options);
 
   // Additional setup for unit tests can be done here.

package/tests/helpers/setup-ember-debug-test.js

@@ -1,3 +1,4 @@
+/* eslint-disable ember/no-runloop */
 import Application from '@ember/application';
 import Resolver from 'ember-resolver';
 import EmberRouter from '@ember/routing/router';
@@ -9,6 +10,8 @@ import {
   teardownContext,
 } from '@ember/test-helpers';
 import { run } from '@ember/runloop';
+import Route from '@ember/routing/route';
+import Controller from '@ember/controller';
 import BasicAdapter from 'ember-inspector/services/adapters/basic';
 import config from 'ember-inspector/config/environment';
 import EmberDebug from 'ember-debug/main';
@@ -33,6 +36,7 @@ export default function setupEmberDebugTest(hooks, options = {}) {
     await setupContext(this);
     await setupApplicationContext(this);
 
+    // eslint-disable-next-line ember/no-classic-classes
     const Router = EmberRouter.extend({
       location: 'none',
     });
@@ -49,6 +53,16 @@ export default function setupEmberDebugTest(hooks, options = {}) {
 
     this.owner.register('router:main', Router);
     this.owner.register('service:adapter', BasicAdapter);
+    /**
+     * preferably, ember debug tests should use their own test app
+     * but currently its mangled with the inspector ui app, which is not compatible with all ember versions being tested.
+     * we do filter the tests to only run the ember_debug tests, but that does not prevent the app merging.
+     * The application route/controller/template of inspector ui was being indirectly used in ember_debug tests,
+     * which is not required and broke older lts tests
+     */
+    this.owner.register('route:application', class extends Route {});
+    this.owner.register('controller:application', class extends Controller {});
+    this.owner.register('template:application', hbs('{{outlet}}'));
 
     run(() => {
       EmberDebug.isTesting = true;

package/tests/integration/injection-test.js

@@ -1,5 +1,6 @@
 import { module, test } from 'qunit';
 import { setupApplicationTest } from 'ember-qunit';
+import Service from '@ember/service';
 
 class ChromePort {
   constructor(self, other) {
@@ -122,7 +123,7 @@ class ChromeApi {
       },
       sendMessage(msg) {
         (self.backgroundScript || self.inspector).subscribers.forEach((sub) =>
-          sub(msg, self.sender)
+          sub(msg, self.sender),
         );
       },
       onMessage: {
@@ -236,7 +237,6 @@ module('Integration | Injection', function (hooks) {
     if (injected) return;
     const backgroundScript = await (await fetch('/background.js')).text();
     {
-      // eslint-disable-next-line no-unused-vars
       const chrome = backgroundChromeApi;
       eval(backgroundScript);
       assert.strictEqual(chrome.onRemovedListeners.length, 1);
@@ -251,10 +251,10 @@ module('Integration | Injection', function (hooks) {
     let windowMessages = 0;
 
     // setup global loader for ember-debug, will be reset after test
-    // eslint-disable-next-line no-unused-vars
+
     const { define, requireModule } = getLoader(
       window.define,
-      window.requireModule
+      window.requireModule,
     );
     window.define = define;
     window.requireModule = requireModule;
@@ -262,7 +262,7 @@ module('Integration | Injection', function (hooks) {
       // eslint-disable-next-line no-unused-vars
       const chrome = contentChromeApi;
       backgroundChromeApi.onTabActivatedListeners.forEach((act) =>
-        act({ tabId: 1 })
+        act({ tabId: 1 }),
       );
       eval(contentScript);
     }
@@ -270,7 +270,7 @@ module('Integration | Injection', function (hooks) {
     assert.strictEqual(
       windowMessages,
       0,
-      'content script should not send window messages'
+      'content script should not send window messages',
     );
 
     window.chrome = inspectorChromeApi;
@@ -290,6 +290,7 @@ module('Integration | Injection', function (hooks) {
         }
       });
     });
+    owner.register('service:port', class extends Service {});
     owner.lookup('service:adapters/web-extension');
     await p;
     await emberDebugStarted;
@@ -314,7 +315,6 @@ module('Integration | Injection', function (hooks) {
     window.NO_EMBER_DEBUG = true;
   });
 
-  // eslint-disable-next-line qunit/require-expect
   test('inject ember debug via content and background scripts', async function (assert) {
     await inject(this.owner, assert);
     const { requireModule } = getLoader(window.define, window.requireModule);
@@ -322,25 +322,24 @@ module('Integration | Injection', function (hooks) {
     assert.notStrictEqual(
       emberDebug,
       undefined,
-      'ember debug should be loaded'
+      'ember debug should be loaded',
     );
   });
 
-  // eslint-disable-next-line qunit/require-expect
   test('add Inspect Ember Component Context Menu Item', async function (assert) {
     await inject(this.owner, assert);
     assert.true(
       !!backgroundChromeApi.registeredContextMenus['inspect-ember-component'],
-      'should have registered context menu'
+      'should have registered context menu',
     );
   });
 
-  // eslint-disable-next-line qunit/require-expect
   test('triggering Ember Component Context Menu Item should call inspect nearest', async function (assert) {
     await inject(this.owner, assert);
-    assert.timeout(10);
+    assert.timeout(100);
 
-    const viewInspection = window.EmberInspector.viewDebug.viewInspection;
+    const emberDebug = requireModule('ember-debug/main')['default'];
+    const viewInspection = emberDebug.viewDebug.viewInspection;
 
     const inspectNearestCalled = new Promise((resolve) => {
       viewInspection.inspectNearest = () => {

package/tests/test-adapter.js

@@ -1,4 +1,3 @@
-/* eslint-disable no-console */
 import QUnit from 'qunit';
 import { next } from '@ember/runloop';
 import BasicAdapter from 'ember-inspector/services/adapters/basic';
@@ -22,7 +21,7 @@ export function setupTestAdapter(hooks) {
         applicationName: 'My App',
         booted: true,
       },
-      { isDefault: true }
+      { isDefault: true },
     );
 
     respondWith(
@@ -38,7 +37,7 @@ export function setupTestAdapter(hooks) {
           },
         ],
       },
-      { isDefault: true }
+      { isDefault: true },
     );
 
     respondWith('app-selected', false, { isDefault: true });
@@ -51,7 +50,7 @@ export function setupTestAdapter(hooks) {
         applicationName,
         count: 0,
       }),
-      { isDefault: true }
+      { isDefault: true },
     );
   });
 
@@ -62,10 +61,10 @@ export function setupTestAdapter(hooks) {
         assert.strictEqual(
           actual,
           expected,
-          `Expceting resouce ${file}:${line} to be opened ${expected} time(s)`
+          `Expceting resouce ${file}:${line} to be opened ${expected} time(s)`,
         );
         reject(
-          `Expceting resouce ${file}:${line} to be opened ${expected} time(s), was opened ${actual} time(s)`
+          `Expceting resouce ${file}:${line} to be opened ${expected} time(s), was opened ${actual} time(s)`,
         );
       }
     }
@@ -75,7 +74,7 @@ export function setupTestAdapter(hooks) {
         assert.strictEqual(
           actual,
           expected,
-          `The correct amount of ${type} messages are sent`
+          `The correct amount of ${type} messages are sent`,
         );
         reject(`Expecting ${expected} ${type} messages, got ${actual}`);
       }
@@ -142,6 +141,7 @@ export async function sendMessage(message) {
   }
 
   const msg = await new Promise((resolve, reject) => {
+    // eslint-disable-next-line ember/no-runloop
     next(async () => {
       let normalized = {
         applicationId: 'my-app',
@@ -210,7 +210,7 @@ export function disableDefaultResponseFor(type) {
     if (responder.type === type && responder.isDefault) {
       if (responder.actual > 0) {
         throw new Error(
-          `Cannot remove default responder for ${type}: a response has already been sent!`
+          `Cannot remove default responder for ${type}: a response has already been sent!`,
         );
       }
 
@@ -220,7 +220,7 @@ export function disableDefaultResponseFor(type) {
   }
 
   throw new Error(
-    `Cannot remove default responder for ${type}: no such responder!`
+    `Cannot remove default responder for ${type}: no such responder!`,
   );
 }
 
@@ -248,7 +248,7 @@ export default class TestAdapter extends BasicAdapter {
     if (!file) {
       QUnit.assert.ok(
         file,
-        `resource has valid "file" field: ${JSON.stringify(file)}`
+        `resource has valid "file" field: ${JSON.stringify(file)}`,
       );
       return;
     }
@@ -256,7 +256,7 @@ export default class TestAdapter extends BasicAdapter {
     if (!line) {
       QUnit.assert.ok(
         file,
-        `resource has valid "line" field: ${JSON.stringify(line)}`
+        `resource has valid "line" field: ${JSON.stringify(line)}`,
       );
       return;
     }
@@ -287,7 +287,7 @@ export default class TestAdapter extends BasicAdapter {
     if (!message.type) {
       QUnit.assert.ok(
         false,
-        `message has valid "type" field: ${JSON.stringify(message)}`
+        `message has valid "type" field: ${JSON.stringify(message)}`,
       );
       return;
     }
@@ -296,7 +296,7 @@ export default class TestAdapter extends BasicAdapter {
       QUnit.assert.strictEqual(
         message.from,
         'devtools',
-        `message has valid "from" field: ${JSON.stringify(message)}`
+        `message has valid "from" field: ${JSON.stringify(message)}`,
       );
       return;
     }
@@ -320,13 +320,13 @@ export default class TestAdapter extends BasicAdapter {
         if (response) {
           console.debug(
             'Received response (inspectedWindow -> devtools)',
-            response
+            response,
           );
           didRespond = sendMessage(response);
         } else if (response === false) {
           console.debug(
             'Ignoreing message (devtools -> inspectedWindow)',
-            message
+            message,
           );
           didRespond = Promise.resolve();
         }

package/tests/test-helper.js

@@ -13,8 +13,13 @@ import 'ember-debug/main';
 
 registerWaiter();
 
+/**
+ * we need to override the adapter that is set up in initializers/setup.js
+ * for that we suffix the name of setup initializer with `-2` so that
+ * this initializer comes right after it
+ */
 Application.initializer({
-  name: `00-override-adapter`,
+  name: `setup-2-override-adapter`,
   initialize(app) {
     app.register('service:adapter', TestAdapter);
   },

package/tests/unit/check-current-route-test.js

@@ -3,8 +3,6 @@ import { module, test } from 'qunit';
 
 module('Unit | Helper | checkCurrentRoute', function () {
   test('matches the correct routes', function (assert) {
-    assert.expect(8);
-
     const testSet = [
       {
         currentRoute: {
@@ -102,8 +100,6 @@ module('Unit | Helper | checkCurrentRoute', function () {
   });
 
   test('does not match incorrect routes', function (assert) {
-    assert.expect(4);
-
     const testSet = [
       {
         currentRoute: {

package/tests/unit/resizable-columns-test.js

@@ -82,34 +82,34 @@ module('Unit | Lib | ResizableColumns', function (hooks) {
     assert.strictEqual(
       resizableColumns.columns[0].width,
       5,
-      'first column should have the correct width'
+      'first column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[1].width,
       10,
-      'second column should have the correct width'
+      'second column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[2].width,
       15,
-      'last column should have the correct width'
+      'last column should have the correct width',
     );
 
     resizableColumns.updateColumnWidth('1', 15);
     assert.strictEqual(
       resizableColumns.columns[0].width,
       15,
-      'first column should have the correct width'
+      'first column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[1].width,
       10,
-      'second column should have the correct width'
+      'second column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[2].width,
       5,
-      'last column should have the correct width'
+      'last column should have the correct width',
     );
 
     // Check if it caches the updated widths
@@ -118,34 +118,34 @@ module('Unit | Lib | ResizableColumns', function (hooks) {
     assert.strictEqual(
       resizableColumns.columns[0].width,
       15,
-      'first column should have the correct width'
+      'first column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[1].width,
       10,
-      'second column should have the correct width'
+      'second column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[2].width,
       5,
-      'last column should have the correct width'
+      'last column should have the correct width',
     );
 
     resizableColumns.resetWidths();
     assert.strictEqual(
       resizableColumns.columns[0].width,
       10,
-      'first column should have the correct width'
+      'first column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[1].width,
       10,
-      'second column should have the correct width'
+      'second column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[2].width,
       10,
-      'last column should have the correct width'
+      'last column should have the correct width',
     );
 
     // Table width upate
@@ -153,17 +153,17 @@ module('Unit | Lib | ResizableColumns', function (hooks) {
     assert.strictEqual(
       resizableColumns.columns[0].width,
       5,
-      'first column should have the correct width'
+      'first column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[1].width,
       5,
-      'second column should have the correct width'
+      'second column should have the correct width',
     );
     assert.strictEqual(
       resizableColumns.columns[2].width,
       5,
-      'last column should have the correct width'
+      'last column should have the correct width',
     );
   });
 
@@ -173,12 +173,12 @@ module('Unit | Lib | ResizableColumns', function (hooks) {
     assert.strictEqual(
       this.options.storage.keys().length,
       1,
-      'Only uses one key'
+      'Only uses one key',
     );
     assert.strictEqual(
       this.options.storage.keys()[0],
-      'list__my-key',
-      'Uses the correct key'
+      'list-my-key',
+      'Uses the correct key',
     );
   });
 
@@ -188,59 +188,62 @@ module('Unit | Lib | ResizableColumns', function (hooks) {
     resizableColumns.build();
 
     assert.deepEqual(
-      resizableColumns.columns.filterBy('visible').mapBy('id'),
+      resizableColumns.columns
+        .filter((col) => col.visible)
+        .map((col) => col.id),
       ['1', '2'],
-      'shows/hides according to schema'
+      'shows/hides according to schema',
+    );
+    assert.deepEqual(
+      resizableColumns.getColumnVisibility().map((col) => col.visible),
+      [true, true, false],
     );
-    assert.deepEqual(resizableColumns.getColumnVisibility().mapBy('visible'), [
-      true,
-      true,
-      false,
-    ]);
 
     resizableColumns.toggleVisibility('3');
     assert.deepEqual(
-      resizableColumns.columns.filterBy('visible').mapBy('id'),
+      resizableColumns.columns
+        .filter((col) => col.visible)
+        .map((col) => col.id),
       ['1', '2', '3'],
-      'toggles the third column correctly'
+      'toggles the third column correctly',
+    );
+    assert.deepEqual(
+      resizableColumns.getColumnVisibility().map((col) => col.visible),
+      [true, true, true],
     );
-    assert.deepEqual(resizableColumns.getColumnVisibility().mapBy('visible'), [
-      true,
-      true,
-      true,
-    ]);
 
     resizableColumns.toggleVisibility('1');
     assert.deepEqual(
-      resizableColumns.columns.filterBy('visible').mapBy('id'),
+      resizableColumns.columns
+        .filter((col) => col.visible)
+        .map((col) => col.id),
       ['2', '3'],
-      'toggles the first column correctly'
+      'toggles the first column correctly',
+    );
+    assert.deepEqual(
+      resizableColumns.getColumnVisibility().map((col) => col.visible),
+      [false, true, true],
     );
-    assert.deepEqual(resizableColumns.getColumnVisibility().mapBy('visible'), [
-      false,
-      true,
-      true,
-    ]);
 
     // Confirm correct caching
     resizableColumns = new ResizableColumns(this.options);
     resizableColumns.build();
     assert.deepEqual(
-      resizableColumns.columns.filterBy('visible').mapBy('id'),
+      resizableColumns.columns
+        .filter((col) => col.visible)
+        .map((col) => col.id),
       ['2', '3'],
-      'caching overrides schema visibility settings'
+      'caching overrides schema visibility settings',
+    );
+    assert.deepEqual(
+      resizableColumns.getColumnVisibility().map((col) => col.visible),
+      [false, true, true],
     );
-    assert.deepEqual(resizableColumns.getColumnVisibility().mapBy('visible'), [
-      false,
-      true,
-      true,
-    ]);
   });
 
   test("resets cache correctly if schema doesn't match cache", function (assert) {
-    assert.expect(1);
     this.options.storage.removeItem = (key) => {
-      assert.strictEqual(key, 'list__my-key', 'cache was cleared');
+      assert.strictEqual(key, 'list-my-key', 'cache was cleared');
     };
     let resizableColumns = new ResizableColumns(this.options);
     resizableColumns.build();
@@ -257,10 +260,9 @@ module('Unit | Lib | ResizableColumns', function (hooks) {
 
   test('clears expired cache', function (assert) {
     let sixtyDaysAgo = 1000 * 60 * 60 * 24 * 30 * 2;
-    storage['list__my-key'] = { updatedAt: Date.now() - sixtyDaysAgo };
-    assert.expect(1);
+    storage['list-my-key'] = { updatedAt: Date.now() - sixtyDaysAgo };
     this.options.storage.removeItem = (key) => {
-      assert.strictEqual(key, 'list__my-key', 'cache was cleared');
+      assert.strictEqual(key, 'list-my-key', 'cache was cleared');
     };
     let resizableColumns = new ResizableColumns(this.options);
     resizableColumns.build();

package/tests/unit/utils/parse-text-test.js

@@ -7,18 +7,18 @@ module('Unit | Utility | parseText', function () {
     assert.strictEqual(
       parseText('foo'),
       'foo',
-      'does not add quotes for string'
+      'does not add quotes for string',
     );
     assert.strictEqual(
       parseText('"foo"'),
       'foo',
-      'removes quotes when simple string is already wrapped in quotes'
+      'removes quotes when simple string is already wrapped in quotes',
     );
     assert.strictEqual(parseText('1'), 1);
     assert.strictEqual(
       parseText('"{"name":"teddy"}"'),
       '{"name":"teddy"}',
-      'removes quotes around JSON strings'
+      'removes quotes around JSON strings',
     );
   });
 });

package/tests/unit/utils/search-match-test.js

@@ -5,27 +5,27 @@ module('Unit | Utility | searchMatch', function () {
   test('searchMatch returns the correct results', function (assert) {
     assert.ok(
       searchMatch('something-component-test', 'something'),
-      'simple search with dash in text'
+      'simple search with dash in text',
     );
 
     assert.ok(
       searchMatch('something-component-test', 'something-comp'),
-      'content with dash; query with dash'
+      'content with dash; query with dash',
     );
 
     assert.ok(
       searchMatch('something-component-test', 'somethingcomp'),
-      'content with dash; query without dash'
+      'content with dash; query without dash',
     );
 
     assert.ok(
       searchMatch('Something-component-test', 'somethingComp'),
-      'content with dash and capital; query with capital and without dash'
+      'content with dash and capital; query with capital and without dash',
     );
 
     assert.notOk(
       searchMatch('Something-component-test', 'xxx'),
-      'match not found'
+      'match not found',
     );
   });
 });

package/tests/unit/utils/type-check-test.js

@@ -0,0 +1,22 @@
+import { inspect } from 'ember-debug/utils/type-check';
+import { module, test } from 'qunit';
+
+module('Unit | Utility | type-check', function () {
+  test('inspect | An POJO with Symbols is correctly transformed into preview', async function (assert) {
+    let symbol = Symbol('test');
+    let symbolValue = Symbol('value');
+
+    let inspected = {
+      [symbol]: 'Symbol Value',
+      symbolVal: symbolValue,
+    };
+
+    let obj = inspect(inspected);
+
+    assert.deepEqual(
+      obj,
+      '{ symbolVal: Symbol(value) }',
+      'object is in expected shape',
+    );
+  });
+});

package/tsconfig.json

@@ -5,6 +5,7 @@
     // layout, which is not resolvable with the Node resolution algorithm, to
     // work with TypeScript.
     "baseUrl": ".",
+    "lib": ["ES2023", "DOM"],
     "paths": {
       "ember-debug/deps/*": ["node_modules/*"],
       "ember-debug/*": ["ember_debug/*"],
@@ -15,7 +16,8 @@
       "ui/test-support": ["lib/ui/addon-test-support"],
       "ui/test-support/*": ["lib/ui/addon-test-support/*"],
       "*": ["types/*"]
-    }
+    },
+    "types": ["chrome", "./node_modules/ember-source/types/stable"]
   },
   "include": ["app/**/*", "tests/**/*", "types/**/*", "lib/ui/**/*"]
 }

package/types/ember-inspector/index.d.ts

@@ -3,7 +3,8 @@ import Ember from 'ember';
 declare global {
   // Prevents ESLint from "fixing" this via its auto-fix to turn it into a type
   // alias (e.g. after running any Ember CLI generator)
-  // eslint-disable-next-line @typescript-eslint/no-empty-interface
+
+  // eslint-disable-next-line @typescript-eslint/no-empty-object-type
   interface Array<T> extends Ember.ArrayPrototypeExtensions<T> {}
   // interface Function extends Ember.FunctionPrototypeExtensions {}
 }

package/types/global.d.ts

@@ -1,7 +1 @@
-// Types for compiled templates
-declare module 'ember-inspector/templates/*' {
-  import { TemplateFactory } from 'ember-cli-htmlbars';
-
-  const tmpl: TemplateFactory;
-  export default tmpl;
-}
+import '@glint/environment-ember-loose';