Errors in console

[kotlyarchuks]

Version

6.0.12

Browser and OS info

Chrome 98.0.4758.102 / Windows 10

Steps to reproduce

page with Vue 3 app, opening or refreshing prints errors in console for every child component in tree

backend.js:704 An error occurred in hook 'walkComponentParents' with payload

TypeError: Cannot read properties of null (reading 'instanceMap')
at ComponentWalker.mark (backend.js:6148:51)
at ComponentWalker.captureId (backend.js:6051:10)
at ComponentWalker.getComponentParents (backend.js:5945:10)
at backend.js:6333:40
at DevtoolsHookable.callHandlers (backend.js:702:17)
at DevtoolsApi.callHook (backend.js:192:29)
at DevtoolsApi.walkComponentParents (backend.js:270:32)
at Object. (backend.js:1941:61)

What is expected?

no errors

What is actually happening?

errors

[Akryum]

Please provide a runnable reproduction, thanks.

[sebaguse]

I have the same issue, not really sure what is the root cause

[nicecue]

[hansonfang]

same problem

[tks-007]

打开控制台还能vuedevtools就报错

[Akryum]

@tks-007 please update Vue, looks like you are on an older version.

[hansonfang]

Is this related to Vue version? I had to use Vue2 and Vue3 in a single page since I've used micro frontend

[symmetriq]

I have the same issue. We currently have a mix of Vue 2 (2.6.14) and Vue 3 (3.2.31) components.

The beta version of Vue Dev Tools (6.0.0 beta 21) does not have this issue, so I have reverted back to the beta again.

[gewisser]

Vue Dev Tools 6.1.4

[gewisser]

@Akryum

Repo: https://github.com/gewisser/VueToolsBug

npm install
npm run dev

1. open http://localhost:9000/
2. open DevTools (F12)
3. activate the tab "Vue"
4. reload page (F5)

[HC200ok]

What about reinstall your vuejs devtools?
https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd

[gewisser]

What about reinstall your vuejs devtools? https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd

Thanks! Reinstalled vuejs devtools. In my case the problem is gone.

[mobsean]

What about reinstall your vuejs devtools? https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd

Thanks! Reinstalled vuejs devtools. In my case the problem is gone.

this works. Issue should be closed, I think

[kspackman]

Seeing the same issue on Vue DevTools 6.1.4. Vue 3.2.31 and 3.2.37. Hundreds of repeated console errors. Reinstalling didn't help. Any updates on it, @Akryum?

[symmetriq]

Still not working here. Exact same issue as before (An error occurred in hook 'walkComponentParents' with payload, repeated over and over in the console). Reinstalling doesn't solve the problem. As I mentioned before, we're using both Vue 2 (2.6.11) and Vue 3 (3.2.30).

The beta version (6.0.0 beta 21) still works fine, but after upgrading vue-router to the latest version (4.1.3), it's now complaining that I'm still on the Dev Tools beta and router links don't work when Dev Tools is open.

The current version of Dev Tools (6.2.1) seems to work anyway, but the console errors are really annoying.

[cantkillemall]

I confirm I have this message ONLY when the Vue Devtools 6.2.1 extension is activated. Console remains silent when deactivated.
Error appeared after upgrading from Nuxt 3 RC6 to RC8. It uses Vue 3.2.37.

With Vue Devtools 6.2.1

Without Vue Devtools

[nurRiyad]

I had the same issue in nuxt-rc8. Reinstalling the Vue dev tool solved my issue

[paolodina]

FWIW, I see the same issue with Vue 3.2.41/devtools 6.4.5 , but only when Chrome DevTools Network throttling set to 3G, with no error on regular network settings.

[dpmango]

What about reinstall your vuejs devtools? https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd

It actually works. Had issue with Nuxt 3.1.x throwing hook 'walkComponentParents'

[Fil923]

I've tried multiple time reinstalling the extension but i'm still having errors in console trying to modify the value of a ref inside custom components.
Vue 2.7.14/ devtools 6.50

[seb-guz]

same problem for me, reinstalled devtools and the problem still exists

[GLaDOS-Mesa]

Same issue here!
Vue v. 2.7.14 with Composition API
DevTool v. 6.5.0

[wuduo0701]

I had the same problem, repeated reinstall the extension didn't work.
Vue v. 2.6.11 / DevTool v. 6.5.0

[rebz]

This has been an ongoing issue for the better part of a year, attempting to debug this in a large app has been painful.

vue: 3.2.47
devtools: 6.5.0

No amount of uninstalling (devtools), re-installing, clearing node_modules, clearing yarn cache, deleting the yarn.lock file, etc... fixes this.

I've updated our app to only load 2 components, the Root Component, and an empty component (just a paragraph tag inside). The error will occur and reference the empty component VNode.

I've tried creating a sandbox of this to share, but I can't seem to replicate it.

Still digging.

[conorhooley]

Also experiencing this on an app being migrated to Vue 3. Vue 3.2.47 & devtools 6.5.0. Clearing & reinstalling node_modules didn't work, nor did removing & reinstalling the Chrome extension.

[davide-granello]

same issue

[rebz]

This has been an ongoing issue for the better part of a year, attempting to debug this in a large app has been painful.

vue: 3.2.47
devtools: 6.5.0

No amount of uninstalling (devtools), re-installing, clearing node_modules, clearing yarn cache, deleting the yarn.lock file, etc... fixes this.

I've updated our app to only load 2 components, the Root Component, and an empty component (just a paragraph tag inside). The error will occur and reference the empty component VNode.

I've tried creating a sandbox of this to share, but I can't seem to replicate it.

Still digging.

Coming back to state that the error no longer occurs. We are currently on "vue": "^3.3.2",, we were seeing this on 3.2.47. I have no reason to believe that upgrading Vue solved it.

I don't know when the error stopped exactly, and looking through our commits/MRs I cannot see anything specifically that would have been a potential trigger. Worth noting that we are still migrating to Vue 3 and a lot more components have been updated.

I know this doesn't help anyone still experiencing the issue. I do believe it is something relevant to our codebase, but unfortunately do not know what.

If I see something that stands out as we continue moving forward I'll come back and post in this thread. For now I am under the belief this is not an issue with this repo.

[vedmant]

I have the same problem, in my case its Nuxt 3 app and this errors start to appear when I set ssr: false, in the Nuxt config. Also this breaks hot reloading.

[lukas-vollmer]

Had same problem with nuxt version 3.7.3. Worked after I allowed "Allow access to file URLs":
https://github.com/vuejs/devtools/issues/1760#issuecomment-1221319674

[TimvdEijnden]

@lukas-vollmer Thanks, this also resolved the issue for me.

I was afraid the error was caused by my application, costed a lot of time to figure out it was caused by de the Vue Dev tools

[TimGuendel]

Same Problem with DevTools 6.5.1 and Nuxt 3.7.4
Lukas' Solution did not fix it. I am getting this error:

Oddly enough, the error appears only when the Chrome DevTools are already opened before I reload my app.
If I open the Chrome DevTools after the app has loaded, everything works 🤔