Skip to content

DisplayName is null onAuthStateChanged when creating a user using SignUpAuthScreen #1344

@Fundi1330

Description

@Fundi1330

[REQUIRED] Describe your environment

  • Operating System version: Ubuntu 22.04.5 LTS
  • Browser version: Chrome 146.0.7680.164
  • Firebase UI version: 7.0.2-beta
  • Firebase SDK version: 12.10.0
  • Package name: @firebase-oss/ui-react

[REQUIRED] Describe the problem

Steps to reproduce

I am using <SignUpAuthScreen/> component with email and password auth enabled. I am using onAuthStateChanged to set the user in my redux store. However, because the displayName is set using updateProfile method, which is called after createUserWithEmailAndPassword, the displayName is null when I set the user object. And there is no way to pass a callback to updateProfile currently. Nor there is a function similar to onAuthStateChanged but for updateProfile.
The issue does not occur with OAuth. Also, the displayName appears when I refresh the page

Relevant Code

https://stackblitz.com/fork/firebase-issue-sandbox

const SignUp = () => {
    const navigate = useNavigate();

    const handleSignUp = () => {
        navigate('/');
    };
    return <>
        <SignUpAuthScreen onSignUp={handleSignUp}>
            <GoogleSignInButton onSignIn={handleSignUp} provider={google} />
            <Link to={'/auth/sign-in'}>Вже маєте аккаунт? Увійдіть у нього!</Link>
        </SignUpAuthScreen>
    </>;
}

const ui = initializeUI({
    app,
    behaviors: [
        requireDisplayName(),
        providerPopupStrategy(),
    ],
});

onAuthStateChanged(auth, async (user) => {
    if (user) {
        const userData = {
            uid: user.uid,
            email: user.email,
            displayName: user.displayName,
            photoURL: user.photoURL,
            emailVerified: user.emailVerified,
            isAnonymous: user.isAnonymous,
            idToken: await user.getIdToken()
        };
        store.dispatch(setUser(userData));
        console.log('User authenticated!');
    } else {
        store.dispatch(setUser(null));
        console.log('Sign out!')
    }
});

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions