Apollo - Uncaught (in promise) Error: Network error: Cannot read property 'kind' of undefined

user_2313848 0
Viewed 2420

I am writing a simple login form using GraphQL and Apollo. Each time after a user logged in, it will refetch the query to grab the user data.

import React, {Component} from 'react'
import AuthForm from './AuthForm'
import loginMutation from '../mutations/Login'
import { graphql } from 'react-apollo'
import userQuery from '../queries/CurrentUser'

//App.js

...
const networkInterface = createNetworkInterface({
  uri: '/graphql',
  opts: {
    credentials: 'same-origin',
  }
})

const client = new ApolloClient({
  dataIdFromObject: o => o.id,
  networkInterface
})
...

//Login.js
class LoginForm extends Component {

onSubmit({ email, password }) {
    this.props.mutate({
        variables: { email, password },
        refetchQueries: [{ userQuery, varibles: null }]
    })
}

render() {
    return (
        <div>
            <h3>Login</h3>
            <AuthForm onSubmit={ this.onSubmit.bind(this) }/> 
        </div>
    )
}
}


export default graphql(loginMutation)(LoginForm)
//userQuery.js
import gql from 'graphql-tag'

export default gql`
    {
        user{
            id
            email
        }
    }
`

The problem is the user can log in but the user query is not getting refetched. Instead I kept getting this error message: Uncaught (in promise) Error: Network error: Cannot read property 'kind' of undefined at new ApolloError (bundle.js:6231). I could not find the cause of this issue. So, can anyone help me with this prob,

react-apollo apollo graphql reactjs javascript
1 Answers
refetchQueries: [{ userQuery, varibles: null }]

Inside the array in the refetchQueries property you have an object userQuery which you're deconstructing which when deconstructed would be { userQuery: userQuery }. This property isn't recognised by Apollo Client, it should be { query: userQuery }. You also have a misspelling in varibles: null. It should be variables: null.

Corrected code:

onSubmit({ email, password }) {
    this.props.mutate({
        variables: { email, password },
        refetchQueries: [{ query: userQuery, variables: null }]
    })
}
user_9831780
Related