search

emberjs / ember-inspector

Adds an Ember tab to the browser's Developer Tools that allows you to inspect Ember objects in your application.
MIT License
975 stars 286 forks source link

Tab "Components" is not opening and an error is thrown. #1655

Open agnyp opened 2 years ago

agnyp commented 2 years ago

Describe the bug Clicking on "Components" does nothing. Instead an Error is logged on console.

To Reproduce Steps to reproduce the behavior:

  1. Go to extension in inspector
  2. Click on "Components"
  3. Open console.
  4. See error in console.
VM22822:103 Ember Inspector has errored.
This is likely a bug in the inspector itself.
You can report bugs at https://github.com/emberjs/ember-inspector.
Error message: You attempted to access the 'element' property on a Glimmer Component, but that property does not exist in Ember.js applications, it only exists in Glimmer.js apps. You define a class field with the same name on your component class and it will overwrite this error message, but it will not be used by the framework.
Stack trace: Error: You attempted to access the 'element' property on a Glimmer Component, but that property does not exist in Ember.js applications, it only exists in Glimmer.js apps. You define a class field with the same name on your component class and it will overwrite this error message, but it will not be used by the framework.
    at throwPropertyUseError (http://localhost:4200/assets/vendor.js:140001:13)
    at HeaderBuilderComponent.get (http://localhost:4200/assets/vendor.js:140022:20)
    at getPossibleMandatoryProxyValue (http://localhost:4200/assets/vendor.js:31237:19)
    at _getProp (http://localhost:4200/assets/vendor.js:31302:17)
    at http://localhost:4200/assets/vendor.js:63758:45
    at http://localhost:4200/assets/vendor.js:63706:37
    at track (http://localhost:4200/assets/vendor.js:71795:7)
    at valueForRef (http://localhost:4200/assets/vendor.js:63705:44)
    at http://localhost:4200/assets/vendor.js:63797:40
    at http://localhost:4200/assets/vendor.js:63706:37
warn @ VM22822:103
handleError @ VM22822:161
messageReceived @ VM22822:5080
(anonymous) @ VM22822:5059
(anonymous) @ VM22822:138
_messageReceived @ VM22822:137
(anonymous) @ VM22822:389

Expected behavior Components should open and show the beautiful overview of the page.

Environment Version 4.4.1, Chrome Version 92.0.4515.107, Windows 10 ember-cli: 3.26.1 node: 14.17.0 os: linux x64

Additional context I couldn't find anything useful in the stack-trace. Probably it's not "long" enough. I'm aware and suspect it might have something to do with the code, not necessarily with the inspector, since it worked just fine yesterday. But I cannot get help at the moment. So, if it's us and despite that you could give me some pointers, I'd be very thankful.

RobbieTheWagner commented 2 years ago

@agnyp the error seems to indicate perhaps you are trying to access this.element on a glimmer component? Glimmer components do not have elements like Ember ones do.