devtools
devtools copied to clipboard
Console errors during mouse-over event for component with no corresponding App
Version
6.1.4
Browser and OS info
Windows 10 / Chrome 101.0.4951.54
Steps to reproduce
The following is happening on my Laravel website that has Vue used on one or two pages. (I haven't used the Vue DevTools in a few months but I never saw this behavior before on my website when I last used it. My website's use of Vue has not changed in that time.)
- Navigate to a page using Vue
- Open DevTools to the Vue tab and note the presence of an App (in the apps list) and a mounted Vue component (under Root in the components list)
- Click on the component and each child to view that component's details
- (leave DevTools open and) Navigate to a different page that does not have a Vue component.
- In DevTools on Vue tab, the component from step 2 is still listed under Root but the app is no longer in the apps list.
- Click on (or mouse over) the component under Root.
At this point, Javascript errors are logged in the console from different points in the backend.js file. (detailed in the 'What is actually happening?' section of this issue)
- Close and re-open the Chrome DevTools to the Vue tab and now the app list and the component list are empty. No more errors are encountered (until repeating from step 1)
What is expected?
No errors
What is actually happening?
Errors seen:
- [Bridge] Error in listener for event b:component:mouse-over with args -- backend.js:7028
- TypeError: Cannot read properties of null (reading 'instanceMap') -- backend.js:7029
Hi, I have the same problem, how can I solve it?
Same here

Got the same problem. Is there any solution for it?