vuejs / devtools-v6

⚙️ Browser devtools extension for debugging Vue.js applications.
https://devtools-v6.vuejs.org/
MIT License
24.63k stars 4.15k forks source link

5.0.7 crashes when attempting to load components #960

Open elDub opened 5 years ago

elDub commented 5 years ago

Version

5.0.7

Browser and OS info

Chrome 73.0.3683.103 • macOS 10.14.4

Steps to reproduce

Loaded page/app and attempt to open Vue Components tab.

What is expected?

Component tree structure shown.

What is actually happening?

No component tree shown and the following error log in the console.

model.js:422 Uncaught TypeError: Cannot convert undefined or null to object
    at Function.keys (<anonymous>)
    at Subclass.SpraypaintBase.reset (model.js:422)
    at Subclass.set [as isPersisted] (model.js:327)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)

I can see that this is crashing within a 3rd-party component, however this did not occur prior to 5.0.7 which I have been using extensively. My page/app continues to function just fine and it is only the developer tool that is non-functional.

Akryum commented 5 years ago

Please provide a runnable minimal reproduction, thanks!

elDub commented 5 years ago

Right now I am not able to reduce to a simple reproduction, though I can again assert that this did not happen until the clone mutation code was introduced in https://github.com/vuejs/vue-devtools/commit/6f947cbd7b81af828a5c6daeaa5f31441b83b524#diff-c8c127dcd09a50f84226a9d0bd60225cR122. The cloning process appears to be triggering a setter method on a Spraypaint model.

maantje commented 5 years ago

I'm not sure if it is related to this issue but maybe it can help debug the issue. I am getting a different error on the same line in backend.js. It works fine for a bit and then after some time, these errors start popping up when changing routes. Closing the tab and opening a new tab resolves the issue for me but then it comes back after a bit.

in Chrome

[vue-router] uncaught error during route navigation:
warn @ vue-router.esm.js:16
abort @ vue-router.esm.js:1904
iterator @ vue-router.esm.js:1968
step @ vue-router.esm.js:1717
step @ vue-router.esm.js:1721
step @ vue-router.esm.js:1721
(anonymous) @ vue-router.esm.js:1718
(anonymous) @ vue-router.esm.js:1964
_callee$ @ index.js:44
tryCatch @ runtime.js:65
invoke @ runtime.js:299
prototype.(anonymous function) @ runtime.js:117
step @ asyncToGenerator.js:17
(anonymous) @ asyncToGenerator.js:35
F @ _export.js:35
(anonymous) @ asyncToGenerator.js:14
(anonymous) @ index.js:26
iterator @ vue-router.esm.js:1943
step @ vue-router.esm.js:1717
step @ vue-router.esm.js:1721
runQueue @ vue-router.esm.js:1725
confirmTransition @ vue-router.esm.js:1972
transitionTo @ vue-router.esm.js:1874
push @ vue-router.esm.js:2181
push @ vue-router.esm.js:2534
handler @ vue-router.esm.js:444
invoker @ vue.common.js:1939
fn._withTask.fn._withTask @ vue.common.js:1774
Uncaught TypeError: Illegal invocation
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)

In Firefox

[vue-router] uncaught error during route navigation:
TypeError: "'set name' called on an object that does not implement interface HTMLFormElement."
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    _clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13832:20
    clone moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:13867:10
    addMutation moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:14522:16
    onMutation moz-extension://a9207f0e-7d55-ba40-84e4-7c45d133b692/build/backend.js:14277:5
    emit eval:1:689
    devtoolPlugin http://localhost:8080/js/main.js:107924:5
    commit http://localhost:8080/js/main.js:108258:53
    commit http://localhost:8080/js/main.js:108258:3
    boundCommit http://localhost:8080/js/main.js:108201:12
    afterEachUnHook http://localhost:8080/js/main.js:107817:5
    updateRoute http://localhost:8080/js/main.js:89770:13
    updateRoute http://localhost:8080/js/main.js:89769:3
    transitionTo http://localhost:8080/js/main.js:89646:5
    confirmTransition http://localhost:8080/js/main.js:89755:7
    step http://localhost:8080/js/main.js:89485:7
    step http://localhost:8080/js/main.js:89492:9
    runQueue http://localhost:8080/js/main.js:89496:3
    confirmTransition http://localhost:8080/js/main.js:89750:5
    step http://localhost:8080/js/main.js:89485:7
    step http://localhost:8080/js/main.js:89489:11
    iterator http://localhost:8080/js/main.js:89735:11
    resolveAsyncComponents http://localhost:8080/js/main.js:89563:22
    iterator http://localhost:8080/js/main.js:89714:7
    step http://localhost:8080/js/main.js:89488:9
    step http://localhost:8080/js/main.js:89492:9
    step http://localhost:8080/js/main.js:89492:9
    step http://localhost:8080/js/main.js:89489:11
    iterator http://localhost:8080/js/main.js:89735:11
    _callee$ http://localhost:8080/js/main.js:115173:15
    tryCatch http://localhost:8080/js/main.js:66726:37
    invoke http://localhost:8080/js/main.js:66960:22
    method http://localhost:8080/js/main.js:66778:16
    step http://localhost:8080/js/main.js:14128:30
    default http://localhost:8080/js/main.js:14146:14
    Promise http://localhost:8080/js/main.js:20621:7
    default http://localhost:8080/js/main.js:14125:12
    make http://localhost:8080/js/main.js:115184:14
    iterator http://localhost:8080/js/main.js:89714:7
    step http://localhost:8080/js/main.js:89488:9
    step http://localhost:8080/js/main.js:89492:9
    runQueue http://localhost:8080/js/main.js:89496:3
    confirmTransition http://localhost:8080/js/main.js:89743:3
    transitionTo http://localhost:8080/js/main.js:89645:3
    push http://localhost:8080/js/main.js:89952:5
    push http://localhost:8080/js/main.js:90305:3
    handler http://localhost:8080/js/main.js:88215:11
    invoker http://localhost:8080/js/main.js:99138:14
    _withTask http://localhost:8080/js/main.js:98973:15
 vue-router.esm.js:1905
asolopovas commented 5 years ago

similar stuff over here

Uncaught (in promise) TypeError: 'get' on proxy: property 'query' is a read-only and non-configurable data property on the proxy target but the proxy did not return its actual value (expected '#<Object>' but got '[object Object]')
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
    at _clone (backend.js:13832)
_clone | @ | backend.js:13832
-- | -- | --
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | _clone | @ | backend.js:13832
  | Promise.then (async) |   |  
  | (anonymous) | @ | vue-router.esm.js?4af9:1772
  | (anonymous) | @ | vue-router.esm.js?4af9:1793
  | (anonymous) | @ | vue-router.esm.js?4af9:1793
  | flatMapComponents | @ | vue-router.esm.js?4af9:1792
  | (anonymous) | @ | vue-router.esm.js?4af9:1728
  | iterator | @ | vue-router.esm.js?4af9:1935
  | step | @ | vue-router.esm.js?4af9:1709
  | step | @ | vue-router.esm.js?4af9:1713
  | (anonymous) | @ | vue-router.esm.js?4af9:1710
  | (anonymous) | @ | vue-router.esm.js?4af9:1956
  | (anonymous) | @ | router.js?9725:31
  | iterator | @ | vue-router.esm.js?4af9:1935
  | step | @ | vue-router.esm.js?4af9:1709
  | step | @ | vue-router.esm.js?4af9:1713
  | runQueue | @ | vue-router.esm.js?4af9:1717
  | confirmTransition | @ | vue-router.esm.js?4af9:1964
  | transitionTo | @ | vue-router.esm.js?4af9:1866
  | push | @ | vue-router.esm.js?4af9:2176
  | push | @ | vue-router.esm.js?4af9:2529
  | handler | @ | vue-router.esm.js?4af9:444
  | invokeWithErrorHandling | @ | vue.esm.js?a4b5:1863
  | invoker | @ | vue.esm.js?a4b5:2188
  | original._wrapper | @ | vue.esm.js?a4b5:7559
angelov-a commented 5 years ago

Similar issue here, component tree does not load.

This is in Firefox, Chromium does work.

Console error: too much recursion[Learn More] app.js line 4653 > eval:172:1 Promise es6.promise.js:172 _clone backend.js:13763 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832 _clone backend.js:13832

elDub commented 5 years ago

As a temporary workaround, I've found that the beta channel version seems to be stuck at 5.0.0 which is fortunate for us. Let's hope they don't update that any time soon!

https://chrome.google.com/webstore/detail/vuejs-devtools/ljjemllljcmogpfapbkkighbhhppjdbg