Signin functions are not resolving with Firebase 10 under capacitor
Operating System
iOS 17.2
Browser Version
Mobile Safari UI/WKWebView
Firebase SDK Version
10.12.2
Firebase SDK Product:
Auth
Describe your project's tooling
Vue 3 app bundled with Vite as local assets inside Capacitor 6 (migrated recently, the same thing happens on Capacitor 5).
Describe the problem
I believe this one is related to the firebase, not the capacitor itself.
The signin functions, no matter if fired by @capacitor-firebase/authentication, or just by Firebase SDK are not resolving, even after acquiring the correct credentials.
This is the simple example of custom authentication for Microsoft provider we use:
const result = (await exchangeCodeForToken({
code
})); //
if (
!result.data.id_token
) {
throw new Error('error exchanging code for a token');
}
// Token acquired correctly
const token = result.data.id_token;
const userCredential = await signInWithCustomToken(auth, token); // <- this line is never resolving
This is the example of custom authentication for Google provider we use:
const result = (await exchangeCodeForToken({
code
}));
if (!result.data.id_token) {
throw new Error('error exchanging code for a token');
}
const token = result.data.id_token;
const credential = GoogleAuthProvider.credential(token);
// Creds acquired correctly
await signInWithCredential(auth, credential); // <- this line is never resolving
The same happens when using @capacitor-firebase/authentication, also for MS, Google providers (The flow is a bit different but with the same result).
Important note is that we had exactly the same problem when using the Firebase version 9; but we were able to find a fix quickly: https://github.com/firebase/firebase-js-sdk/issues/5497
Basically the fix was to initialize auth with some kind of persistence for the capacitor environment:
let auth: Auth;
const getFirebaseAuth = (app: FirebaseApp) => {
if (!auth) {
if (Capacitor.isNativePlatform()) {
auth = initializeAuth(app, { persistence: browserLocalPersistence });
} else {
auth = getAuth(app);
}
}
return auth;
};
With our current version of Firebase (10.12.2), the same problem came back (inside two of our projects). We tried to switch the persistence types and as well, it didn't help. Btw - downgrading to our previous version (9.17.1) makes it functioning correctly.
Steps and code to reproduce issue
Requires some familiarity with Capacitor workflow
- Setup a firebase app and capacitor app Remember that firebaseui does not work inside capacitor environment, so
- Setup auth using
@capacitor-firebase/authenticationlibrary or by handling the signin flow manually ( e.g. Google: https://firebase.google.com/docs/auth/web/google-signin) - Build the capacitor app and run it inside Iphone emulator, try to authenticate using google provider.