Firebase Auth times out when creating users in Reactjs app

Viewed 129

I followed the instructions in firebase's docs on connecting to the Auth Emulator and made a rough sign-up form that I want to use to create users, but when I test it out in the hosting emulator and hit the submit button, no new users are created in the Auth Emulator, and I get an error that says:

Uncaught (in promise) FirebaseError: Firebase: Error (auth/timeout).

I'm certain this timeout occurs because of the createUserWithEmailAndPassword function.

Here's what I'm importing to index.js where my entire app is written:

enter image description here

Here's the signup form component:

class SignUpForm extends React.Component {

    handleSubmit(e) {
        e.preventDefault();

        const auth = getAuth(app);
        connectAuthEmulator(auth, "http://localhost:9099");
        setPersistence(auth, inMemoryPersistence);
        createUserWithEmailAndPassword(auth, e.target.email, e.target.password)
          .then((userCredential) => {
            // Signed in
            const user = userCredential.user;
            ReactDOM.render(
            <UI />,
            document.getElementById('root')
          );
            // ...
          })
          .catch((error) => {
            const errorCode = error.code;
            const errorMessage = error.message;
            // ..
          });
    }

    render() {
        return (
            <>
                <h1>Sign Up</h1>
                <form onSubmit={this.handleSubmit}>
                    <label for='email'>Email</label>
                    <input type='email' name='email' placeholder='Email' />
                    <label for="password">Password</label>
                    <input type="password" name="password" placeholder="Password" />
                    <button type="submit">Submit</button>
                </form>
            </>
        );
    }

}
1 Answers

Replace "e.target.email" with "e.target.email.value".

Related