firebaseui-web-react icon indicating copy to clipboard operation
firebaseui-web-react copied to clipboard

Phone OTP Verification TypeError: Cannot read property 'da' of undefined

Open GorvGoyl opened this issue 4 years ago • 2 comments

I'm using firebaseui-web-react with next.js. I've setup mobile OTP verification method but when I select country code dropdown and clicks outside of it it throws below error:

GIF of issue: https://i.imgur.com/GpN0efI.gif

Unhandled Runtime Error
TypeError: Cannot read property 'da' of undefined


Call Stack
Vk
node_modules\firebaseui\dist\esm.js (216:48)
<unknown>
/_next/static/development/pages/auth.js (4737:374)
qo.<anonymous>
node_modules\firebaseui\dist\esm.js (203:398)
Ae
/_next/static/development/pages/auth.js (4594:438)
ze
node_modules\firebaseui\dist\esm.js (70:443)
Mj
/_next/static/development/pages/auth.js (4707:355)
Lj.push../node_modules/firebaseui/dist/esm.js.Lj.h
node_modules\firebaseui\dist\esm.js (184:281)
xe
/_next/static/development/pages/auth.js (4591:261)
HTMLDialogElement.te
node_modules\firebaseui\dist\esm.js (69:264)
HTMLDialogElement.b
/_next/static/development/pages/auth.js (4589:64)

React File:

    import StyledFirebaseAuth from "react-firebaseui/StyledFirebaseAuth";
    import firebase from "firebase/app";
    import "firebase/auth";
    import initFirebase from "../utils/auth/initFirebase";
    
    initFirebase();
    
    const firebaseAuthConfig = {
      signInFlow: "popup",
      signInOptions: [
        {
          provider: firebase.auth.PhoneAuthProvider.PROVIDER_ID,
          requireDisplayName: false,
          recaptchaParameters: {
            size: "invisible", // 'invisible' or 'compact'
          },
        },
      ],
      signInSuccessUrl: "/",
      credentialHelper: "none",
      callbacks: {
        signInSuccessWithAuthResult: async ({ user }, redirectUrl) => {
         
      },
    };
    
    const FirebaseAuth = () => {
      return (
        <div>
          {renderAuth ? (
            <StyledFirebaseAuth
              uiConfig={firebaseAuthConfig}
              firebaseAuth={firebase.auth()}
            />
          ) : null}
        </div>
      );
    };
    
    export default FirebaseAuth;
    

I used this NextJS repo: https://github.com/vercel/next.js/tree/canary/examples/with-firebase-authentication

GorvGoyl avatar Jun 17 '20 15:06 GorvGoyl

same issue in firebaseui-angular...

deepblue1004 avatar Jan 01 '21 04:01 deepblue1004

I have the same issue. How do you guys handle it?

clarkeustaquio avatar May 21 '21 09:05 clarkeustaquio