ember-inspector 4.13.1-alpha.2025.6.9 → 4.13.1-alpha.2025.7.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (70) hide show
  1. package/app/components/component-tree-item.hbs +1 -1
  2. package/app/components/component-tree-toolbar.hbs +14 -0
  3. package/app/controllers/component-tree.js +18 -0
  4. package/app/routes/whats-new.js +1 -1
  5. package/app/services/adapters/web-extension.ts +3 -0
  6. package/app/templates/component-tree.hbs +3 -0
  7. package/dist/bookmarklet/panes-3-16-0/assets/{chunk.524.d19cdd28d1fc1598d913.js → chunk.524.dc078b33c1b4034ec9ab.js} +4 -4
  8. package/dist/{firefox/panes-3-16-0/assets/chunk.582.42737d6df85c0c3f7bb4.js → bookmarklet/panes-3-16-0/assets/chunk.582.93100838080e3f8318e3.js} +5 -5
  9. package/dist/bookmarklet/panes-3-16-0/assets/ember-inspector.js +16 -16
  10. package/dist/bookmarklet/panes-3-16-0/assets/svg/focus-point-round.svg +9 -0
  11. package/dist/bookmarklet/panes-3-16-0/assets/vendor.js +12 -10
  12. package/dist/bookmarklet/panes-3-16-0/ember_debug.js +9074 -9419
  13. package/dist/bookmarklet/panes-3-16-0/index.html +2 -2
  14. package/dist/chrome/manifest.json +2 -2
  15. package/dist/{firefox/panes-3-16-0/assets/chunk.524.d19cdd28d1fc1598d913.js → chrome/panes-3-16-0/assets/chunk.524.dc078b33c1b4034ec9ab.js} +4 -4
  16. package/dist/{bookmarklet/panes-3-16-0/assets/chunk.582.42737d6df85c0c3f7bb4.js → chrome/panes-3-16-0/assets/chunk.582.93100838080e3f8318e3.js} +5 -5
  17. package/dist/chrome/panes-3-16-0/assets/ember-inspector.js +16 -16
  18. package/dist/chrome/panes-3-16-0/assets/svg/focus-point-round.svg +9 -0
  19. package/dist/chrome/panes-3-16-0/assets/vendor.js +12 -10
  20. package/dist/chrome/panes-3-16-0/ember_debug.js +9074 -9419
  21. package/dist/chrome/panes-3-16-0/index.html +2 -2
  22. package/dist/firefox/manifest.json +2 -2
  23. package/dist/{chrome/panes-3-16-0/assets/chunk.524.d19cdd28d1fc1598d913.js → firefox/panes-3-16-0/assets/chunk.524.dc078b33c1b4034ec9ab.js} +4 -4
  24. package/dist/{websocket/assets/chunk.582.42737d6df85c0c3f7bb4.js → firefox/panes-3-16-0/assets/chunk.582.93100838080e3f8318e3.js} +5 -5
  25. package/dist/firefox/panes-3-16-0/assets/ember-inspector.js +16 -16
  26. package/dist/firefox/panes-3-16-0/assets/svg/focus-point-round.svg +9 -0
  27. package/dist/firefox/panes-3-16-0/assets/vendor.js +12 -10
  28. package/dist/firefox/panes-3-16-0/ember_debug.js +9074 -9419
  29. package/dist/firefox/panes-3-16-0/index.html +2 -2
  30. package/dist/websocket/assets/{chunk.524.d19cdd28d1fc1598d913.js → chunk.524.dc078b33c1b4034ec9ab.js} +4 -4
  31. package/dist/{chrome/panes-3-16-0/assets/chunk.582.42737d6df85c0c3f7bb4.js → websocket/assets/chunk.582.93100838080e3f8318e3.js} +5 -5
  32. package/dist/websocket/assets/ember-inspector.js +16 -16
  33. package/dist/websocket/assets/svg/focus-point-round.svg +9 -0
  34. package/dist/websocket/assets/vendor.js +12 -10
  35. package/dist/websocket/ember_debug.js +9074 -9419
  36. package/dist/websocket/index.html +2 -2
  37. package/ember-cli-build.js +1 -47
  38. package/ember_debug/babel.config.cjs +11 -0
  39. package/ember_debug/libs/render-tree.js +23 -31
  40. package/ember_debug/libs/source-map.js +1 -1
  41. package/ember_debug/libs/view-inspection.js +10 -2
  42. package/ember_debug/object-inspector.js +19 -42
  43. package/ember_debug/package.json +25 -0
  44. package/ember_debug/rollup.config.js +48 -0
  45. package/ember_debug/utils/ember/debug.js +5 -6
  46. package/ember_debug/utils/ember/instrumentation.js +4 -4
  47. package/ember_debug/utils/ember/object/internals.js +5 -10
  48. package/ember_debug/utils/ember/own-runloop.js +1 -1
  49. package/ember_debug/utils/ember/runloop.js +9 -9
  50. package/ember_debug/utils/ember-object-names.js +4 -5
  51. package/ember_debug/utils/ember.js +73 -27
  52. package/ember_debug/utils/rsvp.js +7 -14
  53. package/ember_debug/utils/type-check.js +2 -2
  54. package/ember_debug/vendor/startup-wrapper.js +4 -4
  55. package/ember_debug/view-debug.js +5 -0
  56. package/eslint.config.mjs +1 -0
  57. package/package.json +11 -5
  58. package/pnpm-workspace.yaml +3 -0
  59. package/public/assets/svg/focus-point-round.svg +9 -0
  60. package/skeletons/web-extension/manifest.json +2 -2
  61. package/tests/acceptance/component-tree-test.js +53 -0
  62. package/tests/acceptance/whats-new-test.js +1 -1
  63. package/tests/ember_debug/object-inspector-test.js +10 -5
  64. package/tests/ember_debug/profile-manager-test.js +2 -2
  65. package/tests/ember_debug/profile-node-test.js +1 -1
  66. package/tests/ember_debug/promise-assembler-test.js +1 -1
  67. package/tests/ember_debug/view-debug-test.js +80 -3
  68. package/tests/integration/injection-test.js +1 -1
  69. package/tests/unit/utils/type-check-test.js +1 -1
  70. package/ember_debug/utils/ember/loader.js +0 -22
@@ -1,5 +1,4 @@
1
- import { emberSafeRequire } from 'ember-debug/utils/ember/loader';
2
-
1
+ /* eslint-disable ember/new-module-imports */
3
2
  let Ember;
4
3
 
5
4
  try {
@@ -14,34 +13,65 @@ try {
14
13
  Ember = window.Ember;
15
14
  }
16
15
 
17
- let {
18
- ArrayProxy,
19
- Namespace,
20
- ActionHandler,
21
- ControllerMixin,
22
- CoreObject,
23
- Application,
24
- MutableArray,
25
- MutableEnumerable,
26
- NativeArray,
27
- Component,
28
- Observable,
29
- Evented,
30
- PromiseProxyMixin,
31
- Service,
32
- Object: EmberObject,
33
- ObjectProxy,
34
- VERSION,
35
- ComputedProperty,
36
- meta,
37
- get,
38
- set,
39
- computed,
40
- _captureRenderTree: captureRenderTree,
41
- } = Ember || {};
16
+ const wrappedRequire = function (id) {
17
+ try {
18
+ return Ember.__loader.require(id);
19
+ } catch {
20
+ return requireModule(id);
21
+ }
22
+ };
23
+
24
+ export function emberSafeRequire(id) {
25
+ try {
26
+ return wrappedRequire(id);
27
+ } catch {
28
+ return undefined;
29
+ }
30
+ }
31
+
32
+ let ArrayProxy = Ember.ArrayProxy;
33
+ let Namespace = Ember.Namespace;
34
+ let ActionHandler = Ember.ActionHandler;
35
+ let ControllerMixin = Ember.ControllerMixin;
36
+ let CoreObject = Ember.CoreObject;
37
+ let Application = Ember.Application;
38
+ let MutableArray = Ember.MutableArray;
39
+ let MutableEnumerable = Ember.MutableEnumerable;
40
+ let NativeArray = Ember.NativeArray;
41
+ let Component = Ember.Component;
42
+ let Observable = Ember.Observable;
43
+ let Evented = Ember.Evented;
44
+ let PromiseProxyMixin = Ember.PromiseProxyMixin;
45
+ let Service = Ember.Service;
46
+ let ObjectProxy = Ember.ObjectProxy;
47
+ let VERSION = Ember.VERSION;
48
+ let ComputedProperty = Ember.ComputedProperty;
49
+ let meta = Ember.meta;
50
+ let get = Ember.get;
51
+ let set = Ember.set;
52
+ let computed = Ember.computed;
53
+ let EmberObject = Ember.Object;
54
+ let captureRenderTree = Ember._captureRenderTree;
42
55
 
43
56
  let getEnv = () => Ember.ENV;
44
57
 
58
+ let Debug = emberSafeRequire('@ember/debug');
59
+ let InternalsMetal = emberSafeRequire('@ember/-internals/metal');
60
+ let InternalsRuntime = emberSafeRequire('@ember/-internals/runtime');
61
+ let InternalsUtils = emberSafeRequire('@ember/-internals/utils');
62
+ let InternalsViews = emberSafeRequire('@ember/-internals/views');
63
+ let EmberDestroyable = emberSafeRequire('@ember/destroyable');
64
+ let ObjectInternals = emberSafeRequire('@ember/object/internals');
65
+ let Instrumentation = emberSafeRequire('@ember/instrumentation');
66
+ let Runloop = emberSafeRequire('@ember/runloop');
67
+ let RSVP = emberSafeRequire('rsvp');
68
+ let GlimmerComponent = emberSafeRequire('@glimmer/component');
69
+ let GlimmerManager = emberSafeRequire('@glimmer/manager');
70
+ let GlimmerReference = emberSafeRequire('@glimmer/reference');
71
+ let GlimmerRuntime = emberSafeRequire('@glimmer/runtime');
72
+ let GlimmerUtil = emberSafeRequire('@glimmer/util');
73
+ let GlimmerValidator = emberSafeRequire('@glimmer/validator');
74
+
45
75
  if (!Ember) {
46
76
  captureRenderTree = emberSafeRequire('@ember/debug')?.captureRenderTree;
47
77
  getEnv = emberSafeRequire('@ember/-internals/environment')?.getENV;
@@ -72,6 +102,15 @@ if (!Ember) {
72
102
  }
73
103
 
74
104
  export {
105
+ Runloop,
106
+ Debug,
107
+ InternalsMetal,
108
+ InternalsRuntime,
109
+ InternalsUtils,
110
+ InternalsViews,
111
+ ObjectInternals,
112
+ Instrumentation,
113
+ RSVP,
75
114
  ArrayProxy,
76
115
  Namespace,
77
116
  ActionHandler,
@@ -87,6 +126,7 @@ export {
87
126
  Evented,
88
127
  Service,
89
128
  PromiseProxyMixin,
129
+ EmberDestroyable,
90
130
  EmberObject,
91
131
  VERSION,
92
132
  ComputedProperty,
@@ -96,6 +136,12 @@ export {
96
136
  set,
97
137
  captureRenderTree,
98
138
  getEnv,
139
+ GlimmerComponent,
140
+ GlimmerManager,
141
+ GlimmerReference,
142
+ GlimmerRuntime,
143
+ GlimmerUtil,
144
+ GlimmerValidator,
99
145
  };
100
146
 
101
147
  export default Ember;
@@ -1,21 +1,14 @@
1
- import Ember from './ember';
1
+ import Ember, { RSVP as emberRSVP } from './ember';
2
2
 
3
- let module, RSVP;
3
+ let module;
4
4
 
5
- try {
6
- module = requireModule('rsvp');
7
- RSVP = module.default;
8
-
9
- // The RSVP module should have named exports for `Promise`, etc,
10
- // but some old versions do not and provide `RSVP.Promise`, etc.
11
- if (!('Promise' in module)) {
12
- module = RSVP;
13
- }
14
- } catch {
5
+ if (emberRSVP) {
6
+ module = emberRSVP;
7
+ } else {
15
8
  // eslint-disable-next-line ember/new-module-imports
16
- module = RSVP = Ember.RSVP;
9
+ module = Ember.RSVP;
17
10
  }
18
11
 
19
12
  export let { Promise, all, resolve } = module;
20
13
 
21
- export default RSVP;
14
+ export default module;
@@ -3,8 +3,8 @@ import {
3
3
  ComputedProperty,
4
4
  EmberObject,
5
5
  meta as emberMeta,
6
+ InternalsMetal,
6
7
  } from 'ember-debug/utils/ember';
7
- import { emberSafeRequire } from 'ember-debug/utils/ember/loader';
8
8
 
9
9
  /**
10
10
  * Check if given key on the passed object is a computed property
@@ -41,7 +41,7 @@ export function getDescriptorFor(object, key) {
41
41
  // exists longer than ember 3.10
42
42
  if (Debug.isComputed) {
43
43
  const { descriptorForDecorator, descriptorForProperty } =
44
- emberSafeRequire('@ember/-internals/metal') || {};
44
+ InternalsMetal || {};
45
45
  return (
46
46
  descriptorForDecorator?.(object[key]) ||
47
47
  descriptorForProperty?.(object, key)
@@ -55,11 +55,11 @@ var EMBER_VERSIONS_SUPPORTED = {{EMBER_VERSIONS_SUPPORTED}};
55
55
  });
56
56
 
57
57
  let emberDebugMainModule = requireModule('ember-debug/main');
58
- if (!emberDebugMainModule['default']) {
58
+ if (!emberDebugMainModule) {
59
59
  return;
60
60
  }
61
- window.EmberInspector = emberDebugMainModule['default'];
62
- window.EmberInspector.Adapter = requireModule('ember-debug/adapters/' + adapter)['default'];
61
+ window.EmberInspector = emberDebugMainModule;
62
+ window.EmberInspector.Adapter = requireModule('ember-debug/' + adapter);
63
63
 
64
64
  onApplicationStart(function appStarted(instance) {
65
65
  let app = instance.application;
@@ -149,7 +149,7 @@ var EMBER_VERSIONS_SUPPORTED = {{EMBER_VERSIONS_SUPPORTED}};
149
149
  return;
150
150
  }
151
151
 
152
- const adapterInstance = new (requireModule('ember-debug/adapters/' + currentAdapter)['default']);
152
+ const adapterInstance = new (requireModule('ember-debug/' + currentAdapter));
153
153
 
154
154
  adapterInstance.onMessageReceived(function(message) {
155
155
  if (message.type === 'app-picker-loaded') {
@@ -103,6 +103,11 @@ export default class extends DebugPort {
103
103
  onRightClick(event) {
104
104
  if (event.button === 2) {
105
105
  this.lastRightClicked = event.target;
106
+ if (event.target.shadowRoot) {
107
+ this.lastRightClicked =
108
+ event.target.shadowRoot.elementFromPoint(event.x, event.y) ||
109
+ event.target;
110
+ }
106
111
  }
107
112
  }
108
113
 
package/eslint.config.mjs CHANGED
@@ -60,6 +60,7 @@ export default ts.config(
60
60
  {
61
61
  ignores: [
62
62
  'dist/',
63
+ 'ember_debug/dist/',
63
64
  'node_modules/',
64
65
  'coverage/',
65
66
  '!**/.*',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ember-inspector",
3
- "version": "4.13.1-alpha.2025.6.9+f3062c3",
3
+ "version": "4.13.1-alpha.2025.7.10+e8dd6fa",
4
4
  "description": "Extends developer tools to allow you to better inspect your Ember.js apps.",
5
5
  "repository": "https://github.com/emberjs/ember-inspector",
6
6
  "license": "MIT",
@@ -173,8 +173,9 @@
173
173
  }
174
174
  },
175
175
  "scripts": {
176
- "build": "ember build",
177
- "build:production": "EMBER_ENV=production node scripts/download-panes.js && ember build --environment production && gulp compress:chrome && gulp compress:firefox && gulp clean-tmp",
176
+ "build": "pnpm build:ember-debug && ember build",
177
+ "build:ember-debug": "pnpm --filter ember-debug build",
178
+ "build:production": "pnpm build:ember-debug && EMBER_ENV=production node scripts/download-panes.js && ember build --environment production && gulp compress:chrome && gulp compress:firefox && gulp clean-tmp",
178
179
  "changelog": "github_changelog_generator -u emberjs -p ember-inspector --since-tag v3.8.0",
179
180
  "compress:panes": "gulp compress:chrome-pane && gulp compress:firefox-pane && gulp compress:bookmarklet-pane",
180
181
  "lint": "concurrently \"pnpm:lint:*(!fix)\" --names \"lint:\" --prefixColors auto",
@@ -190,7 +191,12 @@
190
191
  "serve:bookmarklet": "ember serve --port 9191",
191
192
  "start": "ember serve",
192
193
  "test": "concurrently \"pnpm:lint\" \"pnpm:test:*\" --names \"lint,test:\" --prefixColors auto",
193
- "test:ember": "COVERAGE=true ember test",
194
- "watch": "ember build --watch"
194
+ "test:ember": "pnpm build:ember-debug && COVERAGE=true ember test",
195
+ "watch-test": "pnpm '/watch-test:/'",
196
+ "watch-test:ember-debug": "pnpm --filter ember-debug watch",
197
+ "watch-test:inspector-ui": "ember test --serv",
198
+ "watch": "pnpm '/watch:/'",
199
+ "watch:inspector-ui": "ember build --watch",
200
+ "watch:ember-debug": "pnpm --filter ember-debug watch"
195
201
  }
196
202
  }
@@ -0,0 +1,3 @@
1
+ packages:
2
+ - .
3
+ - ember_debug
@@ -0,0 +1,9 @@
1
+ <svg width="800px" height="800px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
2
+ <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
3
+ <g transform="translate(-300.000000, -4439.000000)">
4
+ <g transform="translate(56.000000, 160.000000)" class="svg-fill">
5
+ <path class="svg-fill" d="M264,4281 L264,4286 C264,4286.552 263.552,4287 263,4287 C262.448,4287 262,4286.552 262,4286 L262,4282 C262,4281.448 261.552,4281 261,4281 L257,4281 C256.448,4281 256,4280.552 256,4280 C256,4279.448 256.448,4279 257,4279 L262,4279 C263.105,4279 264,4279.895 264,4281 L264,4281 Z M262,4299 L257,4299 C256.448,4299 256,4298.552 256,4298 C256,4297.448 256.448,4297 257,4297 L261,4297 C261.552,4297 262,4296.552 262,4296 L262,4292 C262,4291.448 262.448,4291 263,4291 C263.552,4291 264,4291.448 264,4292 L264,4297 C264,4298.105 263.105,4299 262,4299 L262,4299 Z M244,4297 L244,4292 C244,4291.448 244.448,4291 245,4291 C245.552,4291 246,4291.448 246,4292 L246,4296 C246,4296.552 246.448,4297 247,4297 L251,4297 C251.552,4297 252,4297.448 252,4298 C252,4298.552 251.552,4299 251,4299 L246,4299 C244.895,4299 244,4298.105 244,4297 L244,4297 Z M244,4286 L244,4281 C244,4279.895 244.895,4279 246,4279 L251,4279 C251.552,4279 252,4279.448 252,4280 C252,4280.552 251.552,4281 251,4281 L247,4281 C246.448,4281 246,4281.448 246,4282 L246,4286 C246,4286.552 245.552,4287 245,4287 C244.448,4287 244,4286.552 244,4286 L244,4286 Z M244.01,4289 L244,4289.01 L244,4288.99 L244.01,4289 Z M254,4291 C252.897,4291 252,4290.103 252,4289 C252,4287.897 252.897,4287 254,4287 C255.103,4287 256,4287.897 256,4289 C256,4290.103 255.103,4291 254,4291 L254,4291 Z M257.859,4290 L259,4290 C259.552,4290 260,4289.552 260,4289 C260,4288.448 259.552,4288 259,4288 L257.859,4288 C257.496,4286.599 256.401,4285.504 255,4285.141 L255,4284 C255,4283.448 254.552,4283 254,4283 C253.448,4283 253,4283.448 253,4284 L253,4285.141 C251.599,4285.504 250.504,4286.599 250.141,4288 L249,4288 C248.448,4288 248,4288.448 248,4289 C248,4289.552 248.448,4290 249,4290 L250.141,4290 C250.504,4291.401 251.599,4292.496 253,4292.859 L253,4294 C253,4294.552 253.448,4295 254,4295 C254.552,4295 255,4294.552 255,4294 L255,4292.859 C256.401,4292.496 257.496,4291.401 257.859,4290 L257.859,4290 Z" id="focus_point_round-[#844]"></path>
6
+ </g>
7
+ </g>
8
+ </g>
9
+ </svg>
@@ -2,7 +2,7 @@
2
2
  "manifest_version": 3,
3
3
  "name": "Ember Inspector (Nightly)",
4
4
  "description": "Tool for debugging Ember applications.",
5
- "version": "2025.6.9",
5
+ "version": "2025.7.10",
6
6
  "icons": {
7
7
  "16": "{{PANE_ROOT}}/assets/images/icon16.png",
8
8
  "38": "{{PANE_ROOT}}/assets/images/icon38.png",
@@ -74,5 +74,5 @@
74
74
  ]
75
75
  }
76
76
  ],
77
- "version_name": "4.13.1 (nightly build 2025.6.9 / f3062c3)"
77
+ "version_name": "4.13.1 (nightly build 2025.7.10 / e8dd6fa)"
78
78
  }
@@ -337,6 +337,59 @@ module('Component Tab', function (hooks) {
337
337
  );
338
338
  });
339
339
 
340
+ test('it should only show parents and children of selected item in focus mode', async function (assert) {
341
+ await visit('/component-tree');
342
+
343
+ function findTreeItem(children, id) {
344
+ for (const child of children) {
345
+ if (child.id.includes(`render-node:${id}`)) {
346
+ return child;
347
+ }
348
+ const found = findTreeItem(child.children, id);
349
+ if (found) {
350
+ return found;
351
+ }
352
+ }
353
+ }
354
+
355
+ function getCustomRenderTree() {
356
+ const tree = getRenderTree({ withChildren: true });
357
+ const subtask = findTreeItem(tree, 6);
358
+ const todo = findTreeItem(tree, 3);
359
+ subtask.children.push(Component({ id: 7, name: 'sub-task-child' }));
360
+ subtask.children.push(Component({ id: 8, name: 'sub-task-child' }));
361
+ todo.children.push(Component({ id: 9, name: 'todo-list-2' }));
362
+ return tree;
363
+ }
364
+
365
+ await sendMessage({
366
+ type: 'view:renderTree',
367
+ tree: getCustomRenderTree(),
368
+ });
369
+
370
+ await rerender();
371
+
372
+ let treeNodes = findAll('.component-tree-item');
373
+ assert.strictEqual(treeNodes.length, 5, 'expected all tree nodes');
374
+
375
+ let expanders = findAll('.component-tree-item-expand');
376
+ let expanderEl = expanders[expanders.length - 1];
377
+ await click(expanderEl);
378
+
379
+ treeNodes = findAll('.component-tree-item');
380
+ const subTask = treeNodes
381
+ .filter((t) => t.textContent.toLowerCase().includes('subtask'))
382
+ .at(-1);
383
+
384
+ respondWith('view:showInspection', false, { count: 1 });
385
+ await click(subTask);
386
+
387
+ await click('[data-test-toggle-focus]');
388
+
389
+ treeNodes = findAll('.component-tree-item');
390
+ assert.strictEqual(treeNodes.length, 6, 'expected all tree nodes');
391
+ });
392
+
340
393
  test('It should clear the search filter when the clear button is clicked', async function (assert) {
341
394
  await visit('/component-tree');
342
395
 
@@ -7,7 +7,7 @@ import { setupTestAdapter } from '../test-adapter';
7
7
  function urlFor(ref) {
8
8
  return `https://raw.githubusercontent.com/emberjs/ember-inspector/${encodeURIComponent(
9
9
  ref,
10
- )}/CHANGELOG.md`;
10
+ )}-ember-inspector/CHANGELOG.md`;
11
11
  }
12
12
 
13
13
  function generateContent(main = false) {
@@ -11,14 +11,14 @@ import EmberObject, { computed } from '@ember/object';
11
11
  import MutableArray from '@ember/array/mutable';
12
12
  import ArrayProxy from '@ember/array/proxy';
13
13
  import ObjectProxy from '@ember/object/proxy';
14
- import Service from '@ember/service';
14
+ import Service, { inject as service } from '@ember/service';
15
15
  import { VERSION } from '@ember/version';
16
16
  import { tracked } from '@glimmer/tracking';
17
17
  import { module, skip, test } from 'qunit';
18
18
  import { hbs } from 'ember-cli-htmlbars';
19
19
  import require from 'require';
20
20
  import hasEmberVersion from '@ember/test-helpers/has-ember-version';
21
- import { compareVersion } from 'ember-debug/utils/version';
21
+ import { compareVersion } from 'ember-debug/version';
22
22
  import EmberDebug from 'ember-debug/main';
23
23
  import setupEmberDebugTest from '../helpers/setup-ember-debug-test';
24
24
  import EmberRoute from '@ember/routing/route';
@@ -902,17 +902,22 @@ module('Ember Debug - Object Inspector', function (hooks) {
902
902
  fooBoo() {
903
903
  return true;
904
904
  },
905
- }).create();
905
+ });
906
+
907
+ this.owner.register('service:test-inspect-service', inspectedService);
906
908
 
907
909
  let inspected = EmberObject.extend({
908
- service: inspectedService,
909
- }).create();
910
+ service: inspectedService.create(),
911
+ service2: service('test-inspect-service'),
912
+ }).create(this);
910
913
 
911
914
  let message = await inspectObject(inspected);
912
915
 
913
916
  let serializedServiceProperty = message.details[1].properties[0];
917
+ let serializedService2Property = message.details[1].properties[1];
914
918
 
915
919
  assert.true(serializedServiceProperty.isService);
920
+ assert.true(serializedService2Property.isService);
916
921
  });
917
922
 
918
923
  test('Proxy Service should be successfully tagged as service on serialization', async function (assert) {
@@ -10,8 +10,8 @@ import { hbs } from 'ember-cli-htmlbars';
10
10
  import EmberDebug from 'ember-debug/main';
11
11
  import setupEmberDebugTest from '../helpers/setup-ember-debug-test';
12
12
  import { run } from '@ember/runloop';
13
- import Ember from 'ember-debug/utils/ember';
14
- import { compareVersion } from 'ember-debug/utils/version';
13
+ import Ember from 'ember-debug/ember';
14
+ import { compareVersion } from 'ember-debug/version';
15
15
  import { setComponentTemplate } from '@ember/component';
16
16
 
17
17
  const { VERSION } = Ember;
@@ -1,5 +1,5 @@
1
1
  import { module, test } from 'qunit';
2
- import ProfileNode from 'ember-debug/models/profile-node';
2
+ import ProfileNode from 'ember-debug/profile-node';
3
3
 
4
4
  module('Ember Debug - ProfileNode', function () {
5
5
  test('It can create a ProfileNode', function (assert) {
@@ -2,7 +2,7 @@ import { run } from '@ember/runloop';
2
2
  import Evented from '@ember/object/evented';
3
3
  import EmberObject from '@ember/object';
4
4
  import { module, test } from 'qunit';
5
- import PromiseAssembler from 'ember-debug/libs/promise-assembler';
5
+ import PromiseAssembler from 'ember-debug/promise-assembler';
6
6
 
7
7
  let assembler;
8
8
 
@@ -20,8 +20,10 @@ import QUnit, { module, test } from 'qunit';
20
20
  import { hbs } from 'ember-cli-htmlbars';
21
21
  import EmberDebug from 'ember-debug/main';
22
22
  import setupEmberDebugTest from '../helpers/setup-ember-debug-test';
23
- import { isInVersionSpecifier } from 'ember-debug/utils/version';
24
- import { VERSION } from 'ember-debug/utils/ember';
23
+ import { isInVersionSpecifier } from 'ember-debug/version';
24
+ import { VERSION } from 'ember-debug/ember';
25
+ import GlimmerComponent from '@glimmer/component';
26
+ import { tracked } from '@glimmer/tracking';
25
27
 
26
28
  let templateOnlyComponent = null;
27
29
  try {
@@ -373,6 +375,7 @@ module('Ember Debug - View', function (hooks) {
373
375
  this.route('test-component-in-in-element');
374
376
  this.route('wormhole');
375
377
  this.route('inputs');
378
+ this.route('component-in-shadow-dom');
376
379
  this.route('comments', { resetNamespace: true }, function () {});
377
380
  this.route('posts', { resetNamespace: true });
378
381
  },
@@ -499,6 +502,31 @@ module('Ember Debug - View', function (hooks) {
499
502
  }),
500
503
  );
501
504
 
505
+ this.owner.register(
506
+ 'component:shadow-dom',
507
+ setComponentTemplate(
508
+ hbs(
509
+ `<div {{did-insert this.setupRoot}} />
510
+ {{#if this.shadow}}
511
+ {{#in-element this.shadow}}
512
+ {{yield}}
513
+ {{/in-element}}
514
+ {{/if}}
515
+ `,
516
+ {
517
+ moduleName: 'my-app/components/shadow-dom.hbs',
518
+ },
519
+ ),
520
+ class extends GlimmerComponent {
521
+ @tracked shadow;
522
+ setupRoot = (element) => {
523
+ this.shadow = element.attachShadow({ mode: 'open' });
524
+ window.testShadow = this.shadow;
525
+ };
526
+ },
527
+ ),
528
+ );
529
+
502
530
  this.owner.register(
503
531
  'component:test-foo',
504
532
  setComponentTemplate(
@@ -596,7 +624,9 @@ module('Ember Debug - View', function (hooks) {
596
624
  hbs(
597
625
  `
598
626
  <div {{did-insert this.foo}}>
599
- Simple {{test-foo}} {{test-bar value=(hash x=123 [x.y]=456)}} {{#in-element this.elementTarget}}<TestComponentInInElement />{{/in-element}}
627
+ <div>
628
+ Simple {{test-foo}} {{test-bar value=(hash x=123 [x.y]=456)}} {{#in-element this.elementTarget}}<TestComponentInInElement />{{/in-element}}
629
+ </div>
600
630
  </div>
601
631
  `,
602
632
  {
@@ -635,6 +665,13 @@ module('Ember Debug - View', function (hooks) {
635
665
  }),
636
666
  );
637
667
 
668
+ this.owner.register(
669
+ 'template:component-in-shadow-dom',
670
+ hbs('<ShadowDom><TestFoo /></ShadowDom>', {
671
+ moduleName: 'my-app/templates/component-in-shadow-dom.hbs',
672
+ }),
673
+ );
674
+
638
675
  this.owner.register(
639
676
  'template:comments/index',
640
677
  hbs('{{#each this.comments as |comment|}}{{comment}}{{/each}}', {
@@ -1200,5 +1237,45 @@ module('Ember Debug - View', function (hooks) {
1200
1237
  .dom('.ember-inspector-tooltip-detail-instance', tooltip)
1201
1238
  .hasText(/ember-wormhole/);
1202
1239
  });
1240
+
1241
+ test('component inside shadow dom', async function (assert) {
1242
+ if (isInVersionSpecifier('^5.8.0', VERSION)) {
1243
+ assert.expect(2);
1244
+ return;
1245
+ }
1246
+ await visit('component-in-shadow-dom');
1247
+ await rerender();
1248
+ await getRenderTree();
1249
+
1250
+ const inShadow = window.testShadow.querySelector('.simple-component');
1251
+
1252
+ await click(window.testShadow.host, {
1253
+ clientX: inShadow.getBoundingClientRect().x,
1254
+ clientY: inShadow.getBoundingClientRect().y,
1255
+ });
1256
+
1257
+ assert
1258
+ .dom('.ember-inspector-tooltip-header', tooltip)
1259
+ .hasText('<TestFoo>');
1260
+
1261
+ let actual = highlight.getBoundingClientRect();
1262
+ let expected = inShadow.getBoundingClientRect();
1263
+
1264
+ assert.ok(isVisible(tooltip), 'tooltip is visible');
1265
+ assert.ok(isVisible(highlight), 'highlight is visible');
1266
+
1267
+ assert.deepEqual(actual.x, expected.x, 'same x as component');
1268
+ assert.deepEqual(actual.y, expected.y, 'same y as component');
1269
+ assert.deepEqual(actual.width, expected.width, 'same width as component');
1270
+ assert.deepEqual(
1271
+ actual.height,
1272
+ expected.height,
1273
+ 'same height as component',
1274
+ );
1275
+
1276
+ assert
1277
+ .dom('.ember-inspector-tooltip-detail-instance', tooltip)
1278
+ .hasText('App.TestFooComponent');
1279
+ });
1203
1280
  });
1204
1281
  });
@@ -338,7 +338,7 @@ module('Integration | Injection', function (hooks) {
338
338
  await inject(this.owner, assert);
339
339
  assert.timeout(100);
340
340
 
341
- const emberDebug = requireModule('ember-debug/main')['default'];
341
+ const emberDebug = requireModule('ember-debug/main');
342
342
  const viewInspection = emberDebug.viewDebug.viewInspection;
343
343
 
344
344
  const inspectNearestCalled = new Promise((resolve) => {
@@ -1,4 +1,4 @@
1
- import { inspect } from 'ember-debug/utils/type-check';
1
+ import { inspect } from 'ember-debug/type-check';
2
2
  import { module, test } from 'qunit';
3
3
 
4
4
  module('Unit | Utility | type-check', function () {
@@ -1,22 +0,0 @@
1
- import Ember from '../ember';
2
-
3
- const require = function (id) {
4
- try {
5
- return Ember.__loader.require(id);
6
- } catch {
7
- return requireModule(id);
8
- }
9
- };
10
-
11
- export function emberSafeRequire(id) {
12
- try {
13
- return require(id);
14
- } catch {
15
- return undefined;
16
- }
17
- }
18
-
19
- export let EmberLoader = {
20
- require,
21
- requireModule: require,
22
- };