Ember-inspector: 'Cannot add property toString, object is not extensible'

[noxmwalsh]

Hey all,

Our team has recently ran into this Ember Inspector related error with the latest 2.1.0 release that went out a few hours ago. The quickest way to see this is to inspect any Ember model in the data store view. Has anyone else experienced this?

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: Cannot add property toString, object is not extensible
Stack trace: TypeError: Cannot add property toString, object is not extensible
    at Mixin.classToString [as toString] (http://localhost:5000/assets/vendor.js:58602:21)
    at mixins.forEach.mixin (<anonymous>:3029:24)
    at Array.forEach (<anonymous>)
    at Class.mixinsForObject (<anonymous>:3026:14)
    at Class.sendObject (<anonymous>:2942:26)
    at Class.inspectModel (<anonymous>:856:37)
    at Object.sendEvent (http://localhost:5000/assets/vendor.js:39028:18)
    at Class.trigger (http://localhost:5000/assets/vendor.js:55337:25)
    at wrap (<anonymous>:3438:14)
    at Class.<anonymous> (<anonymous>:3468:18)

The last part of that stack traces stops here:

function classToString() {
    if (!searchDisabled && !this[_emberMetalMixin.NAME_KEY]) {
      processAllNamespaces();
    }

    var ret = undefined;

    if (this[_emberMetalMixin.NAME_KEY]) {
      ret = this[_emberMetalMixin.NAME_KEY];
    } else if (this._toString) {
      ret = this._toString;
    } else {
      var str = superClassString(this);
      if (str) {
        ret = '(subclass of ' + str + ')';
      } else {
        ret = '(unknown mixin)';
      }
      this.toString = makeToString(ret);
    }

    return ret;
  }

at 'this.toString = makeToString(ret);' (ret being '(unknown mixin)')

We're using the following library versions:

Ember Inspector | 2.1.0
Ember | 2.8.1
Ember Data | 2.8.1
jQuery | 2.1.4

Thanks in advance!

[charliemitchell]

I am also encountering the same issue, along with a co-worker. Furthermore, this happens when trying to pull up any of the views. (Component, Controller)
Chrome Version 60.0.3112.101 (Official Build) (64-bit)
Ember Inspector | 2.1.0
Ember | 2.8.3
jQuery | 3.2.1

[esse]

Same here.

Chrome Version: 60.0.3112.101 (Official Build) (64-bit)
Ember Inspector: 2.1.0
Ember: 2.8.3

[campbecf]

Same.

Chrome Version: 60.0.3112.101 (Official Build) (64-bit)
Ember Inspector: 2.1.0
Ember: 2.8.3
Ember Data: 2.4.3

[campbecf]

Oddly enough this only happens when using the inspector on a locally running ember project. Our released projects on staging / production do not have this issue.

[rwjblue]

The issue is due to Mixin.create using Object.seal to seal the mixin that is created. This only happens in debug builds (so in production there will be no errors).

All of the reports here seem to be coming from users of Ember 2.8, is anyone getting this error on newer Ember versions?

[MorganIsBatman]

Getting it on Ember 2.10

[mapohjola]

Also having this problem on Ember 2.10

[teddyzeenny]

This is an Ember.js core bug for versions < Ember 2.11. In short, calling toString on a mixin also attempts to mutate that mixin by overwriting the toString method. In debug mode, Ember.js seals the Mixin instance by calling Object.seal, which prevents non-own properties from being added/changed.

This bug was fixed by this commit which is included starting Ember >= 2.11. After this commit, toString only mutates the [NAME_KEY] property which is already an "own property", therefore the operation is allowed on sealed objects.

The solution seems to be to simply stop calling toString on Mixins for Ember < 2.11.

cc @rwjblue

[Leooo]

@teddyzeenny can you release a new version for this fix please? Many thanks!

[teddyzeenny]

@Leooo yes I will try to release either today or tomorrow.

[metzelhoff]

Thank you for this fix! Looking forward to the release

[Leooo]

@teddyzeenny any update please?

[teddyzeenny]

The new version is out, let me know if you still have any issues.

[Leooo]

@teddyzeenny thanks, updated to 2.1.1, but now Ember Inspector does not open at all, having this error message:

Uncaught TypeError: Cannot read property 'impl' of undefined
at getPrivateImpl (extensions::utils:130:30)
at Event.publicClassPrototype.(anonymous function) [as addListener] (extensions::utils:148:20)
at listenToEmberDebugPort (chrome-extension://bmdblncegkenkacieihfhpjfppoconhi/content-script.js:47:32)
at chrome-extension://bmdblncegkenkacieihfhpjfppoconhi/content-script.js:30:7

[teddyzeenny]

@Leooo I don't recognize the error, seems like an internal Chrome error. Can you try restarting devtools or Chrome?

[Leooo]

@teddyzeenny restarting chrome a second time fixed the issue. All good now thanks!