CODEWITHSUNDEEP
firebasereact-nativeexpo
Corey Sutton
Corey Sutton

Reputation: 1025

Firebase: Error (auth/invalid-value-(email), starting an object on a scalar field

I am implementing firebase into my application for the first time. I am receiving this error:

"Firebase: Error (auth/invalid-value-(email),-starting-an-object-on-a-scalar-field-invalid-value-(password),-starting-an-object-on-a-scalar-field)."

My code:

registerscreen.js

import { auth } from '../firebase'
import { createUserWithEmailAndPassword } from "firebase/auth";

    export default function RegisterScreen({ navigation }) {
  const [name, setName] = useState({ value: '', error: '' })
  const [email, setEmail] = useState({ value: '', error: '' })
  const [password, setPassword] = useState({ value: '', error: '' })


  const handleSignUp =() => {
    const nameError = nameValidator(name.value)
    const emailError = emailValidator(email.value)
    const passwordError = passwordValidator(password.value)
    if (emailError || passwordError || nameError) {
      setName({ ...name, error: nameError })
      setEmail({ ...email, error: emailError })
      setPassword({ ...password, error: passwordError })
      return
    }
    auth
      createUserWithEmailAndPassword(auth, email, password)
      .then(userCredentials => {
        const user = userCredentials.user;
        console.log(user.email)
      })
      .catch(error => alert(error.message))
  }

firebase.js

// Import the functions you need from the SDKs you need
import * as firebase from "firebase/app";
import { getAnalytics } from "firebase/analytics";
import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";


// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  apiKey: "AIzaSyA1zo9ci0RXQYBNUooGtSK2b29OPxOC0GE",
  authDomain: "aslassistfinal.firebaseapp.com",
  databaseURL: "https://aslassistfinal-default-rtdb.firebaseio.com",
  projectId: "aslassistfinal",
  storageBucket: "aslassistfinal.appspot.com",
  messagingSenderId: "380652280816",
  appId: "1:380652280816:web:5f49bf6df4977cdb401b35",
  //measurementId: "G-TYX10C1CBE"
};

// Initialize Firebase

const app = initializeApp(firebaseConfig);

const auth = getAuth(app);

export { auth }

I cannot find this error in the documentation found here

I have confirmed that the email and password I am using to authenticate is valid.

Thank you in advance for any help and if you need any other info let me know.

Upvotes: 5

Views: 8589

Answers (2)

ImBatman
ImBatman

Reputation: 366

You were getting this error because 'email' was initialized as an object here which comprised of value & error as 2 strings - const [email, setEmail] = useState({ value: '', error: '' })

Firebase auth is expecting string values in createUserWithEmailAndPassword(auth, email, password) method so you need to use email.value instead of just email & same goes for password as well.

ANOTHER TIP - you might also want to remove your firebase credentials from here (firebase.js) as they might get misused

Upvotes: 3

Corey Sutton
Corey Sutton

Reputation: 1025

Answering my own question:

In my state I had:

  const [email, setEmail] = useState({ value: '', error: '' })
  const [password, setPassword] = useState({ value: '', error: '' })

In my inputfields I had:

<TextInput
    label="Email"
    returnKeyType="next"
    value={email.value}
    onChangeText={(text) => setEmail({ value: text, error: '' })}
    error={!!email.error}
    errorText={email.error}
    autoCapitalize="none"
    autoCompleteType="email"
    textContentType="emailAddress"
    keyboardType="email-address"
  />
  <TextInput
    label="Password"
    returnKeyType="done"
    value={password.value}
    onChangeText={(text) => setPassword({ value: text, error: '' })}
    error={!!password.error}
    errorText={password.error}
    secureTextEntry
  />

I am still unsure what the exact meaning of the error is but I changed my state to:

  const [email, setEmail] = useState('')
  const [password, setPassword] = useState('')

And my input fields to:

  <TextInput
    label="Email"
    returnKeyType="next"
    value={email.value}
    onChangeText={text => setEmail(text)}
    error={!!email.error}
    errorText={email.error}
    autoCapitalize="none"
    autoCompleteType="email"
    textContentType="emailAddress"
    keyboardType="email-address"
  />
  <TextInput
    label="Password"
    returnKeyType="done"
    value={password.value}
    onChangeText={text => setPassword(text)}
    error={!!password.error}
    errorText={password.error}
    secureTextEntry
  />

And now I am having no problems. Although I wanted to set error's in my state management, I will just work around it and do something else.

Upvotes: 2

Related Questions