Merge pull request #1301 from lblod/tooling/vite-ember-inspector

Add workaround to get ember-inspector working on vite builds

Author: abeforgit

pnpm-lock.yaml

@@ -2,7 +2,7 @@ import Application from '@ember/application';
 import Resolver from 'ember-resolver';
 import loadInitializers from 'ember-load-initializers';
 import config from './config/environment';
-
+import './inspector-support';
 import compatModules from '@embroider/virtual/compat-modules';
 import './styles/app.scss';
 

test-app/app/app.ts

@@ -0,0 +1,28 @@
+/**
+ * Workaround to get the ember-inspector working with vite applications.
+ * Once ember-inspector gets native vite support, we can remove this.
+ */
+
+import Ember from 'ember';
+import * as runtime from '@glimmer/runtime';
+import * as tracking from '@glimmer/tracking';
+import * as validator from '@glimmer/validator';
+// @ts-expect-error this dep is not installed directly
+import * as reference from '@glimmer/reference';
+// @ts-expect-error this dep is not installed directly
+import * as destroyable from '@glimmer/destroyable';
+import { RSVP } from '@ember/-internals/runtime';
+import config from './config/environment';
+
+window.define('@glimmer/tracking', () => tracking);
+window.define('@glimmer/runtime', () => runtime);
+window.define('@glimmer/validator', () => validator);
+// eslint-disable-next-line @typescript-eslint/no-unsafe-return
+window.define('@glimmer/reference', () => reference);
+// eslint-disable-next-line @typescript-eslint/no-unsafe-return
+window.define('@glimmer/destroyable', () => destroyable);
+window.define('rsvp', () => RSVP);
+window.define('ember', () => ({ default: Ember }));
+window.define('test-app/config/environment', () => ({
+  default: config,
+}));

test-app/app/inspector-support.ts

@@ -18,6 +18,8 @@
     {{content-for "body"}}
 
     <script src="/@embroider/virtual/vendor.js"></script>
+    <!-- Needed for ember-inspector workaround. May be removed once it gets native vite support. -->
+    <script src="/node_modules/loader.js"></script>
     <script type="module">
       import Application from './app/app';
       import environment from './app/config/environment';

test-app/index.html

@@ -123,6 +123,7 @@
     "eslint-plugin-prettier": "^5.2.1",
     "eslint-plugin-qunit": "^8.1.2",
     "globals": "^15.14.0",
+    "loader.js": "^4.7.0",
     "prettier": "^3.4.2",
     "prettier-plugin-ember-template-tag": "^2.0.4",
     "prosemirror-dev-tools": "^4.2.0",