Safari: 'Error thrown when reading from IndexedDB'

[jeffcompton]

Operating System

macOS 15.3.2

Environment (if applicable)

Safari 18.3.1

Firebase SDK Version

11.5.0

Firebase SDK Product(s)

Auth

Project Tooling

React app

Detailed Problem Description

The Firebase SDK gets into an error state often where it logs:
Firebase: Error thrown when reading from IndexedDB. Original error: Error looking up record in object store by key range. (app/idb-get)
multiple times in the console.
This is always followed by several unhandled abort errors.

This issue can occur on initial page load. On page load, I call into Firebase auth before performing another network request.

Steps and code to reproduce issue

I have one firebaseConfig.tsx file:

import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";

const firebaseConfig = {
    XXXXXX,
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
export const auth = getAuth(app);

A class called NetworkUtils.tsx that waits on firebase auth when making a network request:

static async makeRequest(
....
): Promise<Response> {
let user = auth.currentUser;
if (!user && authType !== NetworkUtilsAuthType.NONE) {
    // Wait for auth initialization only if currentUser is null
    user = await NetworkUtils.waitForAuthInit();
}

The same file has a function to auth the user

static waitForAuthInit(): Promise<User | null> {
        if (NetworkUtils.authInitialized) {
            // Auth is initialized; return currentUser immediately
            return Promise.resolve(auth.currentUser);
        }

        if (!NetworkUtils.authInitPromise) {
            NetworkUtils.authInitPromise = new Promise((resolve, reject) => {
                const unsubscribe = onIdTokenChanged(
                    auth,
                    (user) => {
                        unsubscribe();
                        NetworkUtils.authInitialized = true;
                        NetworkUtils.authInitPromise = null; // Reset for future calls
                        resolve(user);
                    },
                    (error) => {
                        unsubscribe();
                        NetworkUtils.authInitialized = true;
                        NetworkUtils.authInitPromise = null; // Reset for future calls
                        reject(error);
                    }
                );
            });
        }

        return NetworkUtils.authInitPromise;
    }

[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.

[dlarocque]

Since the warning is from @firebase/app, I believe this is an error in our heartbeat service, so I'll remove the auth tag.

Context: There's a very similar issue that was reported in #6871. We were not able to reproduce the issue, but it was believed that the error was caused by a bug WebKit's IndexedDB. To prevent these errors from affecting users' apps, we wrapped these IDB calls in a try/catch in #7272.

[hsubox76]

Is this in Safari private browsing, or an iFrame, or a PWA, or a webview, or any other additional environment details other than a standard Safari desktop browser? We'd like to catch it but we have to figure out how to reproduce it first.

Also can you confirm the bug does not happen in non-Safari browsers? Or that you don't see it there?

[jeffcompton]

@hsubox76 it was in a non-private Safari window. My website is pure Javascript/TypeScript, has the same architecture as the create react app, has no iFrames, is only meant to be accessed from a browser, and has no offline support.

The error state often gets triggered during development, after I make a javascript change to one file without refreshing the page. I'm using npm. It gets in this state usually once a day after developing for several hours.

When the error state occurs, the only way to make it go away is to quit Safari, launch Safari again, and go to my local dev url (http://localhost:3000). If I see the error state and I close the window, and subsequently re-visit the URL (without quitting Safari), I will experience the same error state again.

Chrome is the only non-Safari desktop browser that I've used. I develop using Chrome (134.0.6998.118) a very limited amount, and I have not experienced the issue on Chrome.

I would be happy to use any dev build with trace logging if that could help uncover the issue.

[hsubox76]

Does this happen outside of development? I assume during development you're using webpack hot reloading?

[jeffcompton]

It hasn't happened outside of development, and yes during development I'm using webpack hot reloading.