Devtools don't work if app loads too long

[jleifeld]

Version

6.0.0-beta.20

Browser and OS info

Chrome 96.0.4664.55, macOS Big Sur

Steps to reproduce

You need an app which takes a bit longer to getting mounted. If it takes longer than 2 seconds following error happen:
Error: Timed out getting app record for app [object Object] at backend.js:978

It gets thrown in this line: https://github.com/vuejs/devtools/blob/321d7eedc7e75b9ca0d37517b22c6c7690be5342/packages/app-backend-core/src/app.ts#L157

Here an example code to reproduce the error:

window.setTimeout(() => {
  const app = new Vue({
    el: '#app',
    data: {
      message: 'Hello Vue!'
    }
  })
  }, 5000)

Then you need to open the DevTools. It could work on the first try if we wait until everything is rendered. After a page reload the error will happen very often.

What is expected?

The DevTools should be working after the Vue instance was mounted.

What is actually happening?

The DevTools aren't reacting. In the browser console following error is thrown:
Error: Timed out getting app record for app [object Object] at backend.js:978

[optiman]

I'm getting a similar error on every page load:

Error: Timed out getting app record for app null
    at backend.js:978

That is followed by:

Uncaught (in promise) TypeError: Cannot read properties of null (reading '__VUE_DEVTOOLS_APP_RECORD_ID__')
    at Object.getAppRecordId (backend.js:953)
    at serializePlugin (backend.js:2466)
    at Object.addPlugin (backend.js:2430)
    at async Object.<anonymous> (backend.js:1746)

Version

6.0.0-beta.20

Browser and OS info

Chrome 96.0.4664.110 / Linux

But in my case the DevTools are seeming to work fine, just these weird errors in the console.

[matrunchyk]

Seems like it's back and either seems like 60000 is not enough, or I should rather change something in my app?

[DoubleJ-G]

I am also still seeing this in Vue 2.7