Vue-devtools: Property or method "toJSON" is not defined

[duziaqin]

TL;DR:
when we use Vue.use to add a plugin, which render a component instance(with Vue.extend), and the component $emit events with vue instance as payload. It cause vue warns.

version:
vue(>2.0.0) vue-devtool(latest)
demo:
codepen
(can't reproduce the bug unless u copy the code, start a demo and open vue-devtool)
bug:
vue warns: Property or method "toJSON" is not defined
facts:

• JSON.stringify would try to call toJSON attr when it meets object. spec
• vue-devtool use JSON.stringify (or circular-json-es6) to deep copy(I guess) the $emit payload
• vue use Proxy(_renderProxy) to warn not defined attr or method during render in develop mode
  

• vue call the _init function (which included _renderProxy) in Vue and Vue.extend(produce _Ctor)

  reason

• vue-devtool find out a $emit, try to use JSON.stringify, JSON.stringify meet _Ctor attr first than circular reference
• _Ctor[0] has _renderProxy, JSON.stringify try to call toJSON, cause getHandler to warn.
• it's a rare bug, because it happens only when _renderPorxy is reached before circular reference.

but, it's real confusing...

[posva]

Hey, sorry for the delay, I tried your demo on an empty index.html page and no errors appears. I guess it has been fixed recently. If not, add a new repro and I'll take a look 🙂

[duziaqin]

please try this demo: to-json-error

[posva]

Maybe you need to update your Vue version. Tell me if you manage to boil it down it in a codepen where I can look at the source code

[d1manson]

I'm having this issue too. See component linked to above.

[Elevista]

@posva @d1manson
I have this issue too.
Same dependency with package-lock.json and same dev tools version
but only mac chrome display this error. windows chrome shows nothing

[KaelWD]

Same here when I have an array of VueComponents in my data object.

Chrome 60 on windows 10.

Here's the relevant part of the stack trace:

Method | File | Line
-- | -- | --
warn | vue.runtime.esm.js?ff9b | 475
warnNonPresent | vue.runtime.esm.js?ff9b | 1607
get | vue.runtime.esm.js?ff9b | 1648
stringify | backend.js | 448
stringify | backend.js | 1968
flush | backend.js: | 1465
(anonymous) | backend.js | 1342
emit | VM3281 | 52

[ElliotPsyIT]

Any further insights on this 'toJSON' not defined on the instance warning? Like @Elevista, I'm not seeing this on Windows Chrome (nor IE11) but I am seeing it on Mac Chrome. I'm using Vue '2.5.13' and see the error either with or without the Vue dev tools installed.

[davidmoshal]

+1 for Mac Chrome

[intermundos]

+1 for Mac Chrome

[intermundos]

Found out that chrome extension Kuker was the reason for this warning.

[erwer8363]

thanks intermundos , it is really because of Kuker, i unstall it , now it is ok...