Firebase - Could not reach Cloud Firestore backend

Environment

WSL 2 - Nuxt Version 3.0.0-rc.8 will result in the same issue module content will have no effect (positive or negative)

---

• Operating System: Linux
• Node Version: v16.16.0
• Nuxt Version: 3.0.0-rc.6
• Package Manager: npm@8.15.1
• Builder: vite
• User Config: css, modules, content
• Runtime Modules: @nuxt/content@2.0.1
• Build Modules: -

---

Reproduction

https://stackblitz.com/edit/github-kzwv1p?file=plugins/firebase.ts

Just a very basic firebase firestore setup. You have to provide your own firebase config. In case you don’t have any, create a new firebase project and use it and create a collection with the name layers in order for the code to work directly out of the box.

Describe the bug

Retrieving and accessing the data from firestore outputs the following into the terminal:

[nitro] [dev] [unhandledRejection] TypeError: a.body.getReader is not a function
    at k.Va (file:///home/projects/github-kzwv1p/.nuxt/dist/server/server.mjs:26618:368)
[2022-08-16T19:32:24.127Z]  @firebase/firestore: Firestore (9.9.2): Could not reach Cloud Firestore backend. Backend didn't respond within 10 seconds.
This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend.

After the first request, data is retrieved, BUT everything stops working, no data can be retrieved again and the application loads a very long time. HMR stops working. Vite building doesn’t work anymore and the app crashed after some reload attempts.

Additional context

Since it runs into the same issue on Stackblitz, I don’t think it has to something with the environment it is executed from.

Logs

WARN  Sourcemap for "/home/projects/github-kzwv1p/node_modules/@firebase/util/dist/node-esm/index.node.esm.js" points to missing source files

✔ Vite server built in 3356ms                                                                    21:37:43
✔ Nitro built in 796 ms                                                                    nitro 21:37:44
[nitro] [dev] [unhandledRejection] TypeError: a.body.getReader is not a function
    at k.Va (file:///home/projects/github-kzwv1p/.nuxt/dist/server/server.mjs:26618:368)
ℹ Vite client warmed up in 9040ms                                                                21:37:46
[2022-08-16T19:37:55.851Z]  @firebase/firestore: Firestore (9.9.2): Could not reach Cloud Firestore backend. Backend didn't respond within 10 seconds.
This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend.
[2022-08-16T19:38:30.861Z]  @firebase/firestore: Firestore (9.9.2): Connection WebChannel transport errored: Vd {
  type: 'c',
  target: <ref *1> Y {
    s: false,
    o: undefined,
    i: $a { src: [Circular *1], g: [Object], h: 4 },
    P: [Circular *1],
    I: null,
    g: Id {
      za: 0,
      l: [Array],
      h: [Mb],
      s: null,
      P: [Object],
      o: '$httpHeaders',
      aa: [Object],
      D: 'gsessionid',
      sa: null,
      g: null,
      W: 'https://firestore.googleapis.com/google.firestore.v1.Firestore/Listen/channel',
      F: [U],
      oa: null,
      la: null,
      V: 31449,
      Za: 4,
      Xa: false,
      j: [Z],
      m: null,
      u: null,
      v: null,
      N: true,
      X: true,
      U: -1,
      ta: -1,
      I: -1,
      C: 0,
      A: 0,
      Y: 0,
      Pa: 5000,
      '$a': 10000,
      Ya: 2,
      ra: 600000,
      qa: [pd],
      Ba: false,
      K: undefined,
      H: true,
      J: '',
      i: [gd],
      Ca: [ld],
      ja: false,
      Ra: false,
      '$': false,
      ka: undefined,
      O: 0,
      L: false,
      B: null,
      Wa: true,
      G: 0
    },
    l: 'https://firestore.googleapis.com/google.firestore.v1.Firestore/Listen/channel',
    h: { database: 'projects//databases/(default)' },
    A: true,
    v: true,
    j: Z { g: [Circular *1] }
  },
  g: <ref *1> Y {
    s: false,
    o: undefined,
    i: $a { src: [Circular *1], g: [Object], h: 4 },
    P: [Circular *1],
    I: null,
    g: Id {
      za: 0,
      l: [Array],
      h: [Mb],
      s: null,
      P: [Object],
      o: '$httpHeaders',
      aa: [Object],
      D: 'gsessionid',
      sa: null,
      g: null,
      W: 'https://firestore.googleapis.com/google.firestore.v1.Firestore/Listen/channel',
      F: [U],
      oa: null,
      la: null,
      V: 31449,
      Za: 4,
      Xa: false,
      j: [Z],
      m: null,
      u: null,
      v: null,
      N: true,
      X: true,
      U: -1,
      ta: -1,
      I: -1,
      C: 0,
      A: 0,
      Y: 0,
      Pa: 5000,
      '$a': 10000,
      Ya: 2,
      ra: 600000,
      qa: [pd],
      Ba: false,
      K: undefined,
      H: true,
      J: '',
      i: [gd],
      Ca: [ld],
      ja: false,
      Ra: false,
      '$': false,
      ka: undefined,
      O: 0,
      L: false,
      B: null,
      Wa: true,
      G: 0
    },
    l: 'https://firestore.googleapis.com/google.firestore.v1.Firestore/Listen/channel',
    h: { database: 'projects//databases/(default)' },
    A: true,
    v: true,
    j: Z { g: [Circular *1] }
  },
  defaultPrevented: false,
  status: 1
}

[edwardcahyadi]

So I’ve managed to connected to firestore with functions and functions-admin using composables and plugins and api endpoints.

@vincekruger If possible, could you share the minimal working code? I think that may help many people here.

[ddddeano]

still an issue, any ideas?