QuotaExceededError for RemoteConfig on Android <10

[sanderschnydrig]

trafficstars

Version info

Angular: 11.2.14

Firebase: 8.10.0

AngularFire: 6.1.5

Other (e.g. Ionic/Cordova, Node, browser, operating system): @capacitor/core: 3.3.3, node: 16.14.0, npm: 8.5.0, MacOS Monetery 12.2.1

How to reproduce these conditions

Stackblitz wont demonstrate the issue as it only seems to happen on Samsung devices with Android 9 or lower. Maybe Letsencrypt issue since the support for that has been dropped on those Android APIs?

Tested on Galaxy Nexus with API 28.

Steps to set up and reproduce app.module.ts

import { AngularFireRemoteConfigModule, DEFAULTS, SETTINGS } from '@angular/fire/remote-config';

function initializeRemoteConfig(remoteConfig: RemoteConfigService) {
  return () => remoteConfig.init()
}

function initializeTheming(theming: ThemingService) {
  return () => theming.init()
}

imports: [
    AngularFireRemoteConfigModule,
],
providers: [
    { provide: DEFAULTS, useValue: { darkMode: false } },
    {
      provide: APP_INITIALIZER,
      useFactory: initializeRemoteConfig,
      deps: [RemoteConfigService],
      multi: true
    },
   {
      provide: APP_INITIALIZER,
      useFactory: initializeTheming,
      deps: [ThemingService],
      multi: true
    }
]

remote-config.service.ts

import { Injectable } from '@angular/core';
import { AngularFireRemoteConfig } from '@angular/fire/remote-config';

@Injectable({
  providedIn: 'root'
})
export class RemoteConfigService {
  constructor(
    private remoteConfig: AngularFireRemoteConfig,
  ) { }

  async init() {
    await this.remoteConfig.ensureInitialized()
  }

  public getString(key: string) {
    return this.remoteConfig.fetchAndActivate().then(async () => {
      const value = await this.remoteConfig.getString(key)
      return value
    })
  }

  public getBoolean(key: string) {
    return this.remoteConfig.fetchAndActivate().then(async () => {
      const value = await this.remoteConfig.getBoolean(key)
      return value
    })
  }
}

theming.service.ts

@Injectable({
  providedIn: 'root'
})
export class ThemingService implements OnDestroy {
constructor(
    private remoteConfig: RemoteConfigService,
) { }

async init() {
    this.remoteConfigDarkMode = await this.remoteConfig.getBoolean('darkMode')
}
}

Debug output

** Errors in the JavaScript console **

** Output from firebase.database().enableLogging(true); **

** Screenshots **

Expected behavior

fetchAndActivate() to not halt code execution on Android <10 and instead provide a fallback like remoteconfig defaults

Actual behavior

Angular will never finish APP_INITIALIZER