stopgap idb replacement broke TS compilation under node due to usage of DOMStringList in @firebase/util 1.5.0

[Ranguna]

[REQUIRED] Describe your environment

• Operating System version: Linux
• Browser version: none, I'm using nodejs
• Firebase SDK version: latest
• Firebase Product: firebase util

[REQUIRED] Describe the problem

Steps to reproduce:

Install @firebase/util and compile under node environment.

To reproduce with firebase-admin (which has a dependency chain to @firebase/util), you can checkout this repo: https://github.com/Ranguna/reproducing-firebase-js-sdk-6085

Relevant Code:

2d672ce#diff-b8c22a8c7d8e12d84f62d2ee45dffda84efae4b8fa6588d1aac8f0d49909fd57R33
The above line introduced the usage of DOMStringList which is not available in node. This breaks ts compilations for firebase-admin through this dependency chain firebase-admin -> @firebase/database-compat -> @firebase/util.

I am now stuck with @firebase/util < 1.5.0.

Typescript compilation result:

> tsc

node_modules/@firebase/util/dist/src/indexeddb.d.ts:19:23 - error TS2304: Cannot find name 'DOMStringList'.

19     objectStoreNames: DOMStringList;
                         ~~~~~~~~~~~~~

node_modules/@firebase/util/dist/src/indexeddb.d.ts:20:22 - error TS2304: Cannot find name 'IDBDatabase'.

20     constructor(_db: IDBDatabase);
                        ~~~~~~~~~~~

node_modules/@firebase/util/dist/src/indexeddb.d.ts:21:55 - error TS2304: Cannot find name 'IDBTransactionMode'.

21     transaction(storeNames: string[] | string, mode?: IDBTransactionMode): TransactionWrapper;
                                                         ~~~~~~~~~~~~~~~~~~

node_modules/@firebase/util/dist/src/indexeddb.d.ts:22:52 - error TS2304: Cannot find name 'IDBObjectStoreParameters'.

22     createObjectStore(storeName: string, options?: IDBObjectStoreParameters): ObjectStoreWrapper;
                                                      ~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/@firebase/util/dist/src/indexeddb.d.ts:28:31 - error TS2304: Cannot find name 'IDBTransaction'.

28     constructor(_transaction: IDBTransaction);
                                 ~~~~~~~~~~~~~~

node_modules/@firebase/util/dist/src/indexeddb.d.ts:33:25 - error TS2304: Cannot find name 'IDBObjectStore'.

33     constructor(_store: IDBObjectStore);
                           ~~~~~~~~~~~~~~

node_modules/@firebase/util/dist/src/indexeddb.d.ts:35:57 - error TS2304: Cannot find name 'IDBIndexParameters'.

35     createIndex(name: string, keypath: string, options: IDBIndexParameters): IndexWrapper;
                                                           ~~~~~~~~~~~~~~~~~~

node_modules/@firebase/util/dist/src/indexeddb.d.ts:43:25 - error TS2304: Cannot find name 'IDBIndex'.

43     constructor(_index: IDBIndex);
                           ~~~~~~~~


Found 8 errors in the same file, starting at: node_modules/@firebase/util/dist/src/indexeddb.d.ts:19

[google-oss-bot]

I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.

[Ranguna]

For anyone coming here with the same problem, you can add the following to you package.json as a temporary solution:

"overrides": {
    "@firebase/util@>1.4.3": "1.4.3"
  }

(works under npm 8.3+)

[hsubox76]

This workaround may work for admin users since you won't have any of the idb dependent packages that were changed (app, analytics, app-check, performance, remote-config, messaging), but for anyone using firebase directly, I don't recommend downgrading @firebase/util by itself because those other packages previously listed were also updated to import some new methods added to util, and those methods won't be there in the old util version and may break the build. For any firebase users having this problem (who are not firebase-admin users) I'd recommend downgrading the entire firebase package as a whole.

In any case I will try to get out a fix ASAP.

[hsubox76]

Sorry, I'm not really used to TS in Node and I'm trying to reproduce and I'm wondering if you can help me figure out how to do so. I've made a repo that has the deps:

    "firebase-admin": "^10.0.2",
    "ts-node": "^10.7.0",
    "typescript": "^4.6.2"

And I've made a simple index.ts:

import { initializeApp, applicationDefault } from "firebase-admin/app";
import { getDatabase } from 'firebase-admin/database';

initializeApp({
  credential: applicationDefault(),
  databaseURL: /** db url here **/
});
getDatabase();

And I've run that file with both tsc index.ts and ts-node index.ts and haven't gotten any errors. What do I need to change to reproduce this?

[Ranguna]

@hsubox76 Thanks for the headsup about the workaround!

I'm extremely sorry, I should've added better steps on how to reproduce this. To make it easier, I created this repo: https://github.com/Ranguna/reproducing-firebase-js-sdk-6085

Run npm i followed by npm run build and you should see the compilation errors pop up.

I'll update the OP with this info.

[Ranguna]

Also, another workaround is to set this in your tsconfig:

{
  "compilerOptions": {
    ...,
    "skipLibCheck": true
  }
}

But that's also extremely risky because it's going to skip type checks for all packages, not just firebase.

EDIT: This workaround will possibly break your app if you are running under node, since the introduced types are not available in a node environment. I've seen similar issues before that have worked in node, so there's a chance it's ok. Make sure you test your app thoroughly if you decide to go with this route.

[Hey]

Also, another workaround is to set this in your tsconfig:

{
  "compilerOptions": {
    ...,
    "skipLibCheck": true
  }
}

But that's also extremely risky because it's going to skip type checks for all packages, not just firebase.

EDIT: This workaround will possibly break your app if you are running under node, since the introduced types are not available in a node environment. I've seen similar issues before that have worked in node, so there's a chance it's ok. Make sure you test your app thoroughly if you decide to go with this route.

Thank you - this worked for us.

[Ranguna]

Also, another workaround is to set this in your tsconfig:

{
  "compilerOptions": {
    ...,
    "skipLibCheck": true
  }
}

But that's also extremely risky because it's going to skip type checks for all packages, not just firebase.

EDIT: This workaround will possibly break your app if you are running under node, since the introduced types are not available in a node environment. I've seen similar issues before that have worked in node, so there's a chance it's ok. Make sure you test your app thoroughly if you decide to go with this route.

Thank you - this worked for us.

Just FYI, "worked" is relative here.

You just lost maybe 50% usefulness of typescript by toggling that setting. Since probably 99% of your total bundled code is located inside node_modules and maybe half of it is written in typescript (wishful thinking, I know); and you have now disabled all type checks around this.

Like I said on my parent comment, make sure you test you code thoroughly; and no, unit tests are probably not enough. Just a friendly heads-up.

Also, don't forget to toggle it back once this is fixed.

[TacB0sS]

This workaround may work for admin users since you won't have any of the idb dependent packages that were changed (app, analytics, app-check, performance, remote-config, messaging), but for anyone using firebase directly, I don't recommend downgrading @firebase/util by itself because those other packages previously listed were also updated to import some new methods added to util, and those methods won't be there in the old util version and may break the build. For any firebase users having this problem (who are not firebase-admin users) I'd recommend downgrading the entire firebase package as a whole.

In any case I will try to get out a fix ASAP.

True.. I cannot compile my project due to this issue, and I am still trying to figure which version of firebase would allow me to continue working

Any ETA on this issue?

[TacB0sS]

ok, so what solved it for me, and this is really a temp solution till a fix would be introduced:

  "dependencies": {
    "firebase": "9.6.7",
    "@firebase/util": "1.4.3",
    "@firebase/app": "0.7.17",
    "@firebase/database-types": "0.9.4",
    "@firebase/database": "0.12.5",
    "@firebase/database-compat": "0.1.5",
    "@firebase/app-compat": "0.1.18",
    "@firebase/component": "0.5.10"
  },
  ...
    "overrides": {
    "firebase": "9.6.7",
    "@firebase/util": "1.4.3",
    "@firebase/app": "0.7.17",
    "@firebase/database-types": "0.9.4",
    "@firebase/database": "0.12.5",
    "@firebase/database-compat": "0.1.5",
    "@firebase/app-compat": "0.1.18",
    "@firebase/component": "0.5.10"
  }

For some reason, only override didn't cut it..

This is not the first time something like that happens..