ember-inspector 4.13.1 → 4.15.0

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,16 +10,24 @@ 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';
 import { hbs } from 'ember-cli-htmlbars';
-import Port from 'ember-debug/port';
+
+import EmberDebugImport from 'ember-debug/main';
+import PortImport from 'ember-debug/port';
+
+let Port;
+let EmberDebug;
 
 export default function setupEmberDebugTest(hooks, options = {}) {
   let app, originalApp, originalPort, originalIgnoreDeprecations;
 
   hooks.beforeEach(async function () {
+    Port = (await PortImport).default;
+    EmberDebug = (await EmberDebugImport).default;
     originalPort = EmberDebug.Port;
     originalApp = getApplication();
     originalIgnoreDeprecations = EmberDebug.IGNORE_DEPRECATIONS;
@@ -33,6 +42,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 +59,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/index.html

@@ -31,7 +31,7 @@
     {{content-for "head-footer"}}
     {{content-for "test-head-footer"}}
   </head>
-  <body class="theme--light">
+  <body class="theme-light">
 
     {{content-for "body"}}
     {{content-for "test-body"}}
@@ -47,7 +47,6 @@
     <script src="{{rootURL}}assets/vendor.js"></script>
     <script src="{{rootURL}}assets/test-support.js"></script>
     <script src="{{rootURL}}assets/ember-inspector.js"></script>
-    <script src="{{rootURL}}ember_debug.js"></script>
     <script src="{{rootURL}}assets/tests.js"></script>
 
     {{content-for "body-footer"}}

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: {
@@ -161,65 +162,6 @@ class ChromeApi {
   }
 }
 
-let loaderInstance = {};
-function getLoader(def, req) {
-  let { define, requireModule } = loaderInstance;
-  if (typeof define !== 'function' || typeof requireModule !== 'function') {
-    (function () {
-      let registry = {},
-        seen = {};
-
-      define = function (name, deps, callback) {
-        if (arguments.length < 3) {
-          callback = deps;
-          deps = [];
-        }
-        registry[name] = { deps, callback };
-      };
-
-      requireModule = function (name) {
-        if (!name.startsWith('ember-debug')) {
-          return req(name);
-        }
-        if (seen[name]) {
-          return seen[name];
-        }
-
-        let mod = registry[name];
-        if (!mod) {
-          throw new Error(`Module: '${name}' not found.`);
-        }
-
-        seen[name] = {};
-
-        let deps = mod.deps;
-        let callback = mod.callback;
-        let reified = [];
-        let exports;
-
-        for (let i = 0, l = deps.length; i < l; i++) {
-          if (deps[i] === 'exports') {
-            reified.push((exports = {}));
-          } else {
-            reified.push(requireModule(deps[i]));
-          }
-        }
-
-        let value = callback.apply(this, reified);
-        seen[name] = exports || value;
-        return seen[name];
-      };
-
-      requireModule.has = req.has;
-
-      define.registry = registry;
-      define.seen = seen;
-    })();
-  }
-  loaderInstance = { define, requireModule };
-  return loaderInstance;
-}
-
 module('Integration | Injection', function (hooks) {
   setupApplicationTest(hooks);
 
@@ -229,14 +171,16 @@ module('Integration | Injection', function (hooks) {
   let contentChromeApi, inspectorChromeApi, backgroundChromeApi;
   const olddefine = window.define;
   const olddrequireModule = window.requireModule;
+  const oldEmber = window.Ember;
 
   let injected;
+  let EmberService = Service;
 
   async function inject(owner, assert) {
     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);
@@ -250,19 +194,11 @@ 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.define = define;
-    window.requireModule = requireModule;
     {
       // eslint-disable-next-line no-unused-vars
       const chrome = contentChromeApi;
       backgroundChromeApi.onTabActivatedListeners.forEach((act) =>
-        act({ tabId: 1 })
+        act({ tabId: 1 }),
       );
       eval(contentScript);
     }
@@ -270,11 +206,19 @@ 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;
 
+    owner.register('service:port', class extends EmberService {});
+    owner.lookup('service:adapters/web-extension');
+    window.requireModule = null;
+    Object.defineProperty(window, 'Ember', {
+      value: null,
+      writable: true,
+    });
+
     const emberDebugStarted = new Promise((resolve) => {
       inspectorChromeApi.runtime.onMessage.addListener((msg) => {
         if (msg.type === 'general:applicationBooted') {
@@ -290,7 +234,21 @@ module('Integration | Injection', function (hooks) {
         }
       });
     });
-    owner.lookup('service:adapters/web-extension');
+
+    // check that we do not have any errors
+    await new Promise((resolve, reject) => {
+      window.addEventListener('error', reject);
+      contentChromeApi.runtime.onMessage.addListener((message) => {
+        if (message?.type === 'inject-ember-debug') {
+          setTimeout(resolve, 200);
+        }
+      });
+    });
+
+    window.requireModule = olddrequireModule;
+    window.Ember = oldEmber;
+    window.dispatchEvent(new Event('Ember'));
+
     await p;
     await emberDebugStarted;
     injected = true;
@@ -314,33 +272,31 @@ 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);
-    const emberDebug = requireModule('ember-debug/main');
+    const emberDebug = globalThis.EmberInspector;
+
     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 = globalThis.EmberInspector;
+    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

@@ -8,13 +8,15 @@ import TestAdapter from './test-adapter';
 import setupSinon from 'ember-sinon-qunit';
 import registerWaiter from 'ember-raf-scheduler/test-support/register-waiter';
 
-// ensure ember-debug is required
-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: {