Firestore with Ionic5 not working on deployed iphone - ios

Question

I have an Ionic 5 app with firestore and cordova.
In the browser, on Android and using livereload on IOS ( ionic cordova run ios --livereload) the app works as expected.
However, when I just build the app (cordova ionic build ios) and end up deploying it to my iphone, the app cannot connect to firebase. Unfortunately I don't have any logs, but a login and read collections don't provide any data.
Do I still need to put the firebase URL somewhere to allow the app to access the internet?
Thanks in advance.
My package.json:
"dependencies": {
"#angular/common": "^12.2.11",
"#angular/core": "^12.2.11",
"#angular/fire": "^7.1.1",
"#angular/forms": "^12.2.11",
"#angular/platform-browser": "^12.2.11",
"#angular/platform-browser-dynamic": "^12.2.11",
"#angular/router": "^12.2.11",
"#ionic-native/background-geolocation": "^5.36.0",
"#ionic-native/broadcaster": "^5.36.0",
"#ionic-native/camera-preview": "^5.36.0",
"#ionic-native/core": "^5.36.0",
"#ionic-native/file": "^5.36.0",
"#ionic-native/file-opener": "^5.36.0",
"#ionic-native/firebase": "^5.36.0",
"#ionic-native/header-color": "^5.36.0",
"#ionic-native/ionic-webview": "^5.36.0",
"#ionic-native/open-native-settings": "^5.36.0",
"#ionic-native/printer": "^5.36.0",
"#ionic-native/splash-screen": "^5.36.0",
"#ionic-native/status-bar": "^5.36.0",
"#ionic-native/toast": "^5.36.0",
"#ionic/angular": "^5.8.5",
"#ionic/core": "^5.8.5",
"#ionic/storage": "2.2.0",
"#tensorflow/tfjs": "^0.13.5",
"#types/webgl2": "0.0.6",
"chart.js": "^2.7.3",
"cordova-android": "9.1.0",
"cordova-open-native-settings": "^1.5.5",
"cordova-plugin-broadcaster": "^4.1.0",
"cordova-plugin-camera-preview": "^0.11.1",
"cordova-plugin-device": "^2.0.3",
"cordova-plugin-headercolor": "^1.0.0",
"cordova-plugin-ionic": "^5.4.6",
"cordova-plugin-ionic-keyboard": "^2.2.0",
"cordova-plugin-ionic-webview": "^5.0.0",
"cordova-plugin-splashscreen": "^5.0.3",
"cordova-plugin-statusbar": "^2.4.3",
"cordova-plugin-whitelist": "^1.3.4",
"cordova-plugin-x-toast": "^2.7.2",
"firebase": "^9.2.0",
"ionic-img-viewer": "^2.9.0",
"ng2-validation": "^4.2.0",
"rxjs": "^6.5.3 || ^7.0.0",
"rxjs-compat": "^6.6.7",
"sw-toolbox": "^3.6.0",
"tslib": "^1.14.1",
"zone.js": "~0.11.4"
},
"devDependencies": {
"#angular-devkit/build-angular": "^12.2.10",
"#angular-eslint/builder": "12.5.0",
"#angular-eslint/eslint-plugin": "12.5.0",
"#angular-eslint/eslint-plugin-template": "12.5.0",
"#angular-eslint/template-parser": "12.5.0",
"#angular/cli": "^12.2.10",
"#angular/compiler": "^12.2.11",
"#angular/compiler-cli": "^12.2.11",
"#angular/language-service": "^12.2.11",
"#ionic/angular-toolkit": "^5.0.3",
"#ionic/v4-migration-tslint": "^1.7.1",
"#types/jasmine": "~3.6.0",
"#types/jasminewd2": "~2.0.3",
"#types/node": "^12.11.1",
"#typescript-eslint/eslint-plugin": "4.16.1",
"#typescript-eslint/parser": "4.16.1",
"cordova-ios": "^6.2.0",
"cordova-plugin-pico": "^1.0.0",
"cordova-plugin-printer": "^0.8.0",
"eslint": "^7.6.0",
"eslint-plugin-import": "2.22.1",
"eslint-plugin-jsdoc": "30.7.6",
"eslint-plugin-prefer-arrow": "1.2.2",
"jasmine-core": "~3.8.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~6.3.2",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.0.3",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"prettier": "2.4.1",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"typescript": "~4.3.5"
},

Answer 1

I think package firestore with version 9 is using ios and indexedDB to store something about the authentification. Then you must add this code :
const app = initializeApp(environment.firebase);
if (Capacitor.isNativePlatform()) {
initializeAuth(app, {
persistence: indexedDBLocalPersistence
});
}
this.firestore = getFirestore(app);
See original answer : https://forum.ionicframework.com/t/firebase-auth-in-sdk-9-does-not-work-on-ios-sim-or-devices/215362