The Setup

I have an Angular application which is hosted by a Spring Boot application. This application is deployed with Cloud Run on GCP which means the domain is not running under project-name.firebase.com, but instead under something.run.app

Since the web-app is mobile-focused, I am required to handle sign-ins via redirect. Hence, I am following redirect best practices from the documentation.

Note: I am actually not sure why I have to do this. Logging in form the localhost always used to work. The reason why I am doing all this is actually production. I wasn't able to login on the production deployment which led me down the rabbit hole of "how to best practive on redirects".

There, option 3 suggests to proxy any /__/auth requests, which is what I am doing by configuring my Spring Boot server as a proxy for any requsts on said paths:

spring:
  cloud:
    gateway:
      routes:
        - id: firebase-auth
          uri: "xxxxxxxxxx.firebaseapp.com"
          predicates:
            - Path: "/__/auth/**"

Since I don't know how to validate Firebase Authenticator Emulator JWTs, I am using a (live) development project, an actual Firebase Project, during local development.

For local development and testing, I am eventually required to set the authDomain to localhost:8008, the address of the local Spring Boot application.

/**
 * Local (development) environment
 */
const API_BASE = 'localhost:8080';

export const environment = {
  production: false,
  apiBaseUrl: `https://${API_BASE}`,
  firebase: {
    config: {
      apiKey: "xxxxxxxxxxxxxxxxxxxxxxx",
      authDomain: `${API_BASE}`,
      projectId: "xxxxxxxxxxxxxxxxxxxxxxx",
      storageBucket: "xxxxxxxxxxxxxxxxxxxx.appspot.com",
      messagingSenderId: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
      appId: "xxxxxxxxxxxxxxxxxxxxxxxx"
    }
  }
};

The Problem

However, the application crashes right on startup with the following error:

main.ts:6 ERROR FirebaseError: Firebase: Error (auth/argument-error).
    at createErrorInternal (index-3363a72a.js:476:40)
    at _assert (index-3363a72a.js:480:15)
    at index-3363a72a.js:9425:13
    at Component.instanceFactory (index-3363a72a.js:9440:10)
    at Provider.getOrInitializeService (index.esm2017.js:290:39)
    at Provider.initialize (index.esm2017.js:234:31)
    at initializeAuth (index-3363a72a.js:594:27)
    at angular-fire.js:227:48
    at angular-fire.js:160:59

This error only occurs if I am specifying the port number on the URL. Setting authDomain to just localhost or 0.0.0.0, won't crash the app. However, in this case I am not able to sign-in as the server requires port 8080.

I have tried to prepare a StackBlitz example, but for some reason I am unable to import browserPopupRedirectResolver, browserSessionPersistence and indexedDBLocalPersistence because why not?! which means I am unable to provide a reproducable example at this point.

The Question

How can I fix this issue and make it work?