Open
Description
[REQUIRED] Describe your environment
- Operating System version: Windows 11
- Browser version: Chrome 104
- Firebase UI version: 6.0.1
- Firebase SDK version: 9.9.3
[REQUIRED] Describe the problem
When following the instructions as documented to create the UI with phone sign-in with the latest version of firebase SDK, the Recaptcha doesn't show on the screen and the browser's consol shows the error:
recaptcha_verifier.ts:46 Uncaught TypeError: app.auth is not a function
at new RecaptchaVerifier (recaptcha_verifier.ts:46:1)
at H.phoneSignInStart (esm.js:344:1)
at I (esm.js:173:1)
at esm.js:353:1
at b (esm.js:353:1)
at esm.js:7:1
at Rn.<anonymous> (esm.js:198:1)
at De (esm.js:71:1)
at Ce (esm.js:70:1)
at mj (esm.js:179:1)
Steps to reproduce:
- initialize the app using the new
import { initializeApp } from "firebase/app";rather than the old approach;
import firebase from "firebase/compat/app";
firebase.initializeApp(firebaseConfig)";- get the Auth instance using the new functional approach
import { getAuth } from "firebase/auth";rather than the oldfirebase.auth()approach - initialize the ui using the auth instance as retrieved in step 2
var ui = new firebaseui.auth.AuthUI(getAuth(app));
Please let me know if this is not the kind of auth instance I'm supposed to path to the AuthUI method. Or how else am I supposed to get it to work with the new SDK?