Cannot read property of undefined

Help
,
1

Hi, I am new at graphql and I am trying to login my user. But it gives error and say: “ApolloError: Cannot read property ‘email’ of undefined” even it is defined. My code is:

function Login() {
    const [email, setEmail] = useState('');
    const [password, setPassword] = useState('');
    const [errors, setErrors] = useState([]);
    const context = useContext(AuthContext)
    const navigate = useNavigate();

    const [loginUser, { loading, error }] = useMutation(LOGIN_USER, {
        onCompleted({ data: { loginUser: userData } }) {
            context.login(userData)
            navigate("/")
        },
        onError({ graphQLErrors }) {
            setErrors(graphQLErrors)
        },
        variables: { loginInput: { email: email, password: password } },
    });

    const handleSubmit = (event) => {
        event.preventDefault();
        loginUser();
    };

    if (loading) return <Loading />;
    if (error) console.log(error);

    return (
        <Form onSubmit={handleSubmit} style={{ marginTop: `100px` }} >
            ...

I am checking the onError function and my email and password reaches there I couldn’t find the problem.

2

Hey @MadonisP :wave:

Is there a stack trace associated with that error? It should point you toward the code that is failing. Can you check your network tab as well to make sure this isn’t a server issue? Not sure if you’re using JavaScript on your server or not, but its possible that error is propagated from your server to the client if so. Again, check your network tab for this request and see if the error is coming through the response or not.

1 Like
3

hey @jerelmiller
well server response is:

{
    "errors": [
        {
            "message": "Cannot read property 'email' of undefined",
            "locations": [
                {
                    "line": 2,
                    "column": 3
                }
            ],
            "path": [
                "loginUser"
            ],
            "extensions": {
                "code": "INTERNAL_SERVER_ERROR"
            }
        }
    ],
    "data": null
}

and my payload is:

{
  "operationName": "loginUser",
  "variables": {
    "loginInput": {
      "email": "d@d.com",
      "password": "12345678"
    }
  }
}

I am using this code on my apollo server and it works but whenever I use on my client it gives error as I said. do you have an Idea now I can’t figure out :frowning:

4

@MadonisP good to see that you’ve confirmed its coming from the server but so sorry to hear you’re having trouble :disappointed:. Unfortunately without access to your server, I’d have a difficult time understanding what to do. I’d start by looking at the resolver for that mutation and trying to understand what is different about the payload between the client and your other requests to it.