feat: Improve error handling and storage cleanup for Firebase UI authentication

Author: exaby73

packages/firebaseui-core/src/auth.ts

@@ -266,9 +266,11 @@ export async function fuiCompleteEmailLinkSignIn(
     if (!email) return null;
 
     const result = await fuiSignInWithEmailLink(auth, email, currentUrl, opts);
-    window.localStorage.removeItem('emailForSignIn');
     return handlePendingCredential(result);
   } catch (error) {
     return handleFirebaseError(error, opts);
+  } finally {
+    window.localStorage.removeItem('emailForSignIn');
+    window.localStorage.removeItem('emailLinkAnonymousUpgrade');
   }
 }

packages/firebaseui-core/tests/unit/auth.test.ts

@@ -28,7 +28,6 @@ import {
   fuiSignInWithOAuth,
   fuiCompleteEmailLinkSignIn,
 } from '../../src/auth';
-import { FirebaseUIError } from '../../src/errors';
 
 // Mock all Firebase Auth functions
 vi.mock('firebase/auth', async () => {
@@ -69,6 +68,7 @@ describe('Firebase UI Auth', () => {
     vi.clearAllMocks();
     mockAuth = { currentUser: null } as Auth;
     window.localStorage.clear();
+    window.sessionStorage.clear();
     (EmailAuthProvider.credential as any).mockReturnValue(mockCredential);
     (EmailAuthProvider.credentialWithLink as any).mockReturnValue(mockCredential);
     (PhoneAuthProvider.credential as any).mockReturnValue(mockCredential);
@@ -338,5 +338,85 @@ describe('Firebase UI Auth', () => {
 
       expect(result).toBeNull();
     });
+
+    it('should clean up storage even when sign in fails', async () => {
+      window.localStorage.setItem('emailForSignIn', '[email protected]');
+      window.localStorage.setItem('emailLinkAnonymousUpgrade', 'true');
+
+      (isSignInWithEmailLink as any).mockReturnValue(true);
+      (signInWithCredential as any).mockRejectedValue(new Error('Sign in failed'));
+
+      await expect(fuiCompleteEmailLinkSignIn(mockAuth, 'mock-url')).rejects.toThrow();
+
+      expect(window.localStorage.getItem('emailForSignIn')).toBeNull();
+      expect(window.localStorage.getItem('emailLinkAnonymousUpgrade')).toBeNull();
+    });
+  });
+
+  describe('Pending Credential Handling', () => {
+    it('should handle pending credential during email sign in', async () => {
+      const storedCred = { type: 'google.com', token: 'stored-token' };
+      window.sessionStorage.setItem('pendingCred', JSON.stringify(storedCred));
+      (signInWithCredential as any).mockResolvedValue(mockUserCredential);
+      (linkWithCredential as any).mockResolvedValue({ ...mockUserCredential, user: { uid: 'linked-uid' } });
+
+      const result = await fuiSignInWithEmailAndPassword(mockAuth, '[email protected]', 'password');
+
+      expect(linkWithCredential).toHaveBeenCalledWith(mockUserCredential.user, storedCred);
+      expect(window.sessionStorage.getItem('pendingCred')).toBeNull();
+      expect(result.user.uid).toBe('linked-uid');
+    });
+
+    it('should handle invalid pending credential gracefully', async () => {
+      window.sessionStorage.setItem('pendingCred', 'invalid-json');
+      (signInWithCredential as any).mockResolvedValue(mockUserCredential);
+
+      const result = await fuiSignInWithEmailAndPassword(mockAuth, '[email protected]', 'password');
+
+      expect(result).toBe(mockUserCredential);
+      expect(window.sessionStorage.getItem('pendingCred')).toBeNull();
+    });
+
+    it('should handle linking failure gracefully', async () => {
+      const storedCred = { type: 'google.com', token: 'stored-token' };
+      window.sessionStorage.setItem('pendingCred', JSON.stringify(storedCred));
+      (signInWithCredential as any).mockResolvedValue(mockUserCredential);
+      (linkWithCredential as any).mockRejectedValue(new Error('Linking failed'));
+
+      const result = await fuiSignInWithEmailAndPassword(mockAuth, '[email protected]', 'password');
+
+      expect(result).toBe(mockUserCredential);
+      expect(window.sessionStorage.getItem('pendingCred')).toBeNull();
+    });
+  });
+
+  describe('Storage Management', () => {
+    it('should clean up all storage items after successful email link sign in', async () => {
+      window.localStorage.setItem('emailForSignIn', '[email protected]');
+      window.localStorage.setItem('emailLinkAnonymousUpgrade', 'true');
+      window.sessionStorage.setItem('pendingCred', JSON.stringify(mockCredential));
+
+      (isSignInWithEmailLink as any).mockReturnValue(true);
+      (signInWithCredential as any).mockResolvedValue(mockUserCredential);
+
+      await fuiCompleteEmailLinkSignIn(mockAuth, 'mock-url');
+
+      expect(window.localStorage.getItem('emailForSignIn')).toBeNull();
+      expect(window.localStorage.getItem('emailLinkAnonymousUpgrade')).toBeNull();
+      expect(window.sessionStorage.getItem('pendingCred')).toBeNull();
+    });
+
+    it('should clean up storage even when sign in fails', async () => {
+      window.localStorage.setItem('emailForSignIn', '[email protected]');
+      window.localStorage.setItem('emailLinkAnonymousUpgrade', 'true');
+
+      (isSignInWithEmailLink as any).mockReturnValue(true);
+      (signInWithCredential as any).mockRejectedValue(new Error('Sign in failed'));
+
+      await expect(fuiCompleteEmailLinkSignIn(mockAuth, 'mock-url')).rejects.toThrow();
+
+      expect(window.localStorage.getItem('emailForSignIn')).toBeNull();
+      expect(window.localStorage.getItem('emailLinkAnonymousUpgrade')).toBeNull();
+    });
   });
 });

packages/firebaseui-core/tests/unit/config.test.ts

@@ -31,6 +31,7 @@ describe('Config', () => {
       const config: FUIConfig = {
         app: mockApp,
         enableAutoAnonymousLogin: false,
+        enableHandleExistingCredential: false,
       };
       const store = initializeUI(config);
       expect(store.get()).toEqual(config);
@@ -46,6 +47,7 @@ describe('Config', () => {
       const config: FUIConfig = {
         app: mockApp,
         enableAutoAnonymousLogin: false,
+        enableHandleExistingCredential: true,
       };
       const store = initializeUI(config, 'custom');
       expect(store.get()).toEqual(config);
@@ -61,6 +63,7 @@ describe('Config', () => {
       const config: FUIConfig = {
         app: mockApp,
         enableAutoAnonymousLogin: true,
+        enableHandleExistingCredential: false,
       };
       initializeUI(config);
       expect(onAuthStateChanged).toHaveBeenCalled();
@@ -78,10 +81,27 @@ describe('Config', () => {
       const config: FUIConfig = {
         app: mockApp,
         enableAutoAnonymousLogin: false,
+        enableHandleExistingCredential: true,
       };
       initializeUI(config);
       expect(onAuthStateChanged).not.toHaveBeenCalled();
     });
+
+    it('should handle both auto features being enabled', () => {
+      const mockApp = {
+        name: 'test',
+        options: {},
+        automaticDataCollectionEnabled: false,
+      } as FirebaseApp;
+      const config: FUIConfig = {
+        app: mockApp,
+        enableAutoAnonymousLogin: true,
+        enableHandleExistingCredential: true,
+      };
+      const store = initializeUI(config);
+      expect(store.get()).toEqual(config);
+      expect(onAuthStateChanged).toHaveBeenCalled();
+    });
   });
 
   describe('getTranslations', () => {

packages/firebaseui-core/tests/unit/errors.test.ts

@@ -1,4 +1,4 @@
-import { describe, it, expect } from 'vitest';
+import { describe, it, expect, beforeEach } from 'vitest';
 import { FirebaseUIError, handleFirebaseError } from '../../src/errors';
 
 describe('FirebaseUIError', () => {
@@ -64,27 +64,26 @@ describe('FirebaseUIError', () => {
 });
 
 describe('handleFirebaseError', () => {
-  it('should throw FirebaseUIError for Firebase errors', () => {
+  beforeEach(() => {
+    window.sessionStorage.clear();
+  });
+
+  it('should throw FirebaseUIError for Firebase errors', async () => {
     const firebaseError = {
       name: 'FirebaseError',
       code: 'auth/user-not-found',
     };
 
-    expect(() => handleFirebaseError(firebaseError)).toThrow(FirebaseUIError);
+    await expect(handleFirebaseError(firebaseError)).rejects.toThrow(FirebaseUIError);
   });
 
-  it('should throw FirebaseUIError with unknown code for non-Firebase errors', () => {
+  it('should throw FirebaseUIError with unknown code for non-Firebase errors', async () => {
     const error = new Error('Random error');
 
-    try {
-      handleFirebaseError(error);
-    } catch (e) {
-      expect(e).toBeInstanceOf(FirebaseUIError);
-      expect(e.code).toBe('unknown');
-    }
+    await expect(handleFirebaseError(error)).rejects.toThrow(FirebaseUIError);
   });
 
-  it('should pass translations to FirebaseUIError', () => {
+  it('should pass translations and language to FirebaseUIError', async () => {
     const firebaseError = {
       name: 'FirebaseError',
       code: 'auth/user-not-found',
@@ -99,29 +98,111 @@ describe('handleFirebaseError', () => {
     };
 
     try {
-      handleFirebaseError(firebaseError, translations, 'es');
+      await handleFirebaseError(firebaseError, { translations, language: 'es' });
     } catch (e) {
       expect(e).toBeInstanceOf(FirebaseUIError);
       expect(e.message).toBe('Usuario no encontrado');
     }
   });
 
-  it('should handle null/undefined errors', () => {
-    expect(() => handleFirebaseError(null)).toThrow(FirebaseUIError);
-    expect(() => handleFirebaseError(undefined)).toThrow(FirebaseUIError);
+  it('should handle null/undefined errors', async () => {
+    await expect(handleFirebaseError(null)).rejects.toThrow(FirebaseUIError);
+    await expect(handleFirebaseError(undefined)).rejects.toThrow(FirebaseUIError);
   });
 
-  it('should preserve the error code in thrown error', () => {
+  it('should preserve the error code in thrown error', async () => {
     const firebaseError = {
       name: 'FirebaseError',
       code: 'auth/wrong-password',
     };
 
     try {
-      handleFirebaseError(firebaseError);
+      await handleFirebaseError(firebaseError);
     } catch (e) {
       expect(e).toBeInstanceOf(FirebaseUIError);
       expect(e.code).toBe('auth/wrong-password');
     }
   });
+
+  describe('account exists with different credential handling', () => {
+    beforeEach(() => {
+      window.sessionStorage.clear();
+    });
+
+    it('should store credential and throw error when enableHandleExistingCredential is true', async () => {
+      const existingCredentialError = {
+        name: 'FirebaseError',
+        code: 'auth/account-exists-with-different-credential',
+        credential: { type: 'google.com', token: 'mock-token' },
+        customData: {
+          email: '[email protected]',
+        },
+      };
+
+      await expect(
+        handleFirebaseError(existingCredentialError, { enableHandleExistingCredential: true })
+      ).rejects.toThrow(FirebaseUIError);
+      expect(window.sessionStorage.getItem('pendingCred')).toBe(JSON.stringify(existingCredentialError.credential));
+    });
+
+    it('should not store credential when enableHandleExistingCredential is false', async () => {
+      const existingCredentialError = {
+        name: 'FirebaseError',
+        code: 'auth/account-exists-with-different-credential',
+        credential: { type: 'google.com', token: 'mock-token' },
+        customData: {
+          email: '[email protected]',
+        },
+      };
+
+      await expect(handleFirebaseError(existingCredentialError)).rejects.toThrow(FirebaseUIError);
+      expect(window.sessionStorage.getItem('pendingCred')).toBeNull();
+    });
+
+    it('should not store credential when no credential in error', async () => {
+      const existingCredentialError = {
+        name: 'FirebaseError',
+        code: 'auth/account-exists-with-different-credential',
+        customData: {
+          email: '[email protected]',
+        },
+      };
+
+      await expect(
+        handleFirebaseError(existingCredentialError, { enableHandleExistingCredential: true })
+      ).rejects.toThrow(FirebaseUIError);
+      expect(window.sessionStorage.getItem('pendingCred')).toBeNull();
+    });
+
+    it('should include email in error and use translations when provided', async () => {
+      const existingCredentialError = {
+        name: 'FirebaseError',
+        code: 'auth/account-exists-with-different-credential',
+        credential: { type: 'google.com', token: 'mock-token' },
+        customData: {
+          email: '[email protected]',
+        },
+      };
+
+      const translations = {
+        es: {
+          errors: {
+            accountExistsWithDifferentCredential: 'La cuenta ya existe con otras credenciales',
+          },
+        },
+      };
+
+      try {
+        await handleFirebaseError(existingCredentialError, {
+          enableHandleExistingCredential: true,
+          translations,
+          language: 'es',
+        });
+      } catch (e) {
+        expect(e).toBeInstanceOf(FirebaseUIError);
+        expect(e.code).toBe('auth/account-exists-with-different-credential');
+        expect(e.message).toBe('La cuenta ya existe con otras credenciales');
+      }
+    });
+  });
 });