fix: > v1.6.0 component tree not connecting on Firefox

[silvio-e]

🐛 The bug

The component tree wouldn't load in Firefox for devtools above 1.6.0. This happens in all of my projects. On Stackblitz this happens also when when I'm opening the preview in a new tab but not in the default preview pane.

🛠️ To reproduce

https://stackblitz.com/edit/nuxt-starter-zdqhmz?file=nuxt.config.ts

🌈 Expected behavior

Expecting that it loads the component tree like in version 1.6.0

ℹ️ Additional context

No response

[antfu]

/cc @webfansplz do you have any idea on this?

[webfansplz]

Hi @silvio-e, I can't reproduce the issue, can you provide more info?

[FxOmar]

I'm experiencing the same issue, and Pinia also remains stuck on the connecting screen.

[jamols09]

I can't even get to show the devtools on local whether true or false devtools: { enabled: true },

[webfansplz]

I'm experiencing the same issue, and Pinia also remains stuck on the connecting screen.

Other features is working as expected? Can you provide a mini repo? Thanks.

[yjlin0224]

Same problems here, component tree and pinia page are connecting forever.
Here is my repo to reproduce it: https://github.com/yjlin0224/nuxt-app

---

Update: I resolved after I disabled "Vue.js devtools" addon in my browser, both Firefox and Chrome work fine now. Thanks #690 (comment)

[silvio-e]

Same here, like for @yjlin0224 disabling Vue devtools resolved the problem for Nuxt Devtools.

But I guess it shouldn't happen?

[roseyda]

same here, just like suggested, disabling vue devtool extension in Chrome solved the issue

[bjorne84]

I'm experiencing this issue with an additional detail that might help debugging:

It gets stuck in http://localhost:3000/_nuxt/node_modules/@vue/devtools-kit/dist/index.js?v=174d22ef

on this line:

parse(string) {
  return this.deserialize(JSON.parse(string));
}

in this function:

  const { json, meta } = payload;
  let result = copy(json);
  if (meta == null ? void 0 : meta.values) {
    result = applyValueAnnotations(result, meta.values, this);
  }
  if (meta == null ? void 0 : meta.referentialEqualities) {
    result = applyReferentialEqualityAnnotations(result, meta.referentialEqualities);
  }
  return result;
}
stringify(object) {
  return JSON.stringify(this.serialize(object));
}
parse(string) {
  return this.deserialize(JSON.parse(string));
}

Environment:

• Firefox: 134.0.1 (64-bit)

• Node: v20.14.0

• Nuxt: 3.15.2

• CLI: 3.7.3

• Nitro: 2.10.4

• Package Manager: npm@8.19.1

• @nuxt/devtools@1.7.0

• @nuxt/devtools-kit@1.7.0

• @nuxt/devtools-wizard@1.7.0

• @nuxt/devtools@1.7.0 (deduped)

Note: The related? issue with extraneous non-props attributes (#745) appeared at the same time but was resolved after upgrading Nuxt/Nitro/package manager.

[Mikaleb]

Bump too on this