Timed out getting app record for app

[DoubleJ-G]

Since adding this library and using the dev tools I see "Error: Timed out getting app record for app at backend.js:1160:14" after 60 seconds and it fills and spams the console. Not sure if it is a dev tools issue but it specifically happened after adding this library and worked fine with Vuex and Vue Router dev tools before.

Vue 2.7 - Vue Dev Tools 6.2.0

[DamianOsipiuk]

Hi, could you provide more details about when this happens?
Do you have some huge data objects that you are fetching from the backend?
Is it broken also for some basic cases?

A minimal reproduction example would be very helpful.

[DoubleJ-G]

This is a minimal reproduction created using vue-cli and using vue 2.7.4 and I tried both vue-query@2.0.0-alpha.6 which we were running and upgrading to vue-query@2.0.0-beta.1 https://github.com/DoubleJ-G/vue-query-devtools-bug. Run the app and open devtools, wait for the 60 second timeout and you'll get an error in the console.

I've just fetched json placeholder todos and recreated the issue, although it only errors once in my reproduction but I get these errors filling my console in my app.

[DamianOsipiuk]

Yeah i can confirm that this happens, although it also seems that devtools plugin is working correctly, as i can explore the state of the cache and it reacts to changes.

I have a feeling that it might be the case when Plugins somehow gets registered twice for some reason.

[DoubleJ-G]

Upgrading to 2.7.5 didn't make the error go away. I think you might be right, adding a breakpoint to the dev tools backend.js shows it being called multiple times, possibly from each component using it?

The devtools do work perfectly fine still, but the issue is much worse in our app where this error will be called 100s of times filling the console.

[DamianOsipiuk]

I guess that this is Vue2 specific issue. I saw somewhere (in some lib) additional logic to prevent registering plugins multiple times.
I will try to find and borrow that piece of code 😉

[DoubleJ-G]

I've seen something similar too, possibly from vue-demi

function install(_vue) {
  _vue = _vue || Vue
  if (_vue && !_vue['__composition_api_installed__'])
    Vue.use(VueCompositionAPI)
}

https://github.com/vueuse/vue-demi/blob/f2f64e3ce01b6561302fc2867a74e4f08f2622e7/lib/v2/index.mjs