Angular Firebase Authentication Update: v.19

Last time we had Firebase Auth integrated at Angular 17. Here is a quick update to keep it fresh in Angular 19.

Providers

Before update, our main.ts looked like this

// main.ts before
const fbApp = () => initializeApp(firebaeConfigHere);
const authApp = () => initializeAuth(fbApp(), {
  persistence: browserSessionPersistence,
  popupRedirectResolver: browserPopupRedirectResolver
});

const firebaseProviders: EnvironmentProviders = importProvidersFrom([
  provideFirebaseApp(fbApp),
  provideAuth(authApp),
]);

bootstrapApplication(AppComponent, {
  providers: [
      // ...
    firebaseProviders
  ],
});

The updates touch the importProvidersFrom, it not longer is needed

// main.ts thew new

const firebaseProviders = [
  provideFirebaseApp(fbApp),
  provideAuth(authApp),
];

bootstrapApplication(AppComponent, {
  providers: [
    // expand it
    ...firebaseProviders
  ],
});

APP_INITIALIZER token

One way to inject the AuthState on application start was to use the APP_INITIALIZER token with no return, and one injection, like this

  {
    provide: APP_INITIALIZER,
    // dummy factory
    useFactory: () => () => {},
    multi: true,
    // injected depdencies, this will be constructed immidiately
    deps: [AuthState],
  },

This simply becomes this:

// new provider
  provideAppInitializer(() => {
    inject(AuthState);
    return null;
  }),

That's it. Looks like the new Firebase library still works as designed.