In react-apollo GraphQL Error

I am having strange issue with Grapqh in apollo.
I use ubuntu 14.04
Nodejs 8.0
npm 5.0

Unhandled (in react-apollo) Error: GraphQL error: context$2$0.sent.cursor is not a function

Does anyone hade same issue?

Thank you!

Are you running a query in the resolver when this happens? Where is the error appearing?

Sorry i forgot to mention that.

It happens only when i run the bundle. So the main.js file that is created after the build command.
I build it on the same machine on which i try to run it.

So when the is “RAW meteor” everything is working just fine.

I tried different NodeJS Versions.
On version 5.0 i am getting errors about fibers,
And on any version higher than 5.0 i have issue with graphql.
The app is starting, but no connection to DB is running.
This error apears on client side, in chrome’s inspector.

Do i need to re-asign the MONGO_URL variable before i run the main.js file?

Nope, MONGO_URL did not fixed anything.

But now i got messages from the server side:

(node:19042) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): GraphQLError: context$2$0.sent.cursor is not a function
(node:19042) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:19042) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 2): GraphQLError: context$2$0.sent.cursor is not a function
(node:19042) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 3): GraphQLError: context$2$0.sent.cursor is not a function
(node:19042) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 1)
(node:19042) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 2)
(node:19042) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 3)
(node:19042) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 4): GraphQLError: context$2$0.sent.cursor is not a function
(node:19042) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 4)
(node:19042) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 5): GraphQLError: context$2$0.sent.cursor is not a function
(node:19042) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 5)

I tried instead of localhost to use 127.0.0.1, and still no luck.

I assume that the issue is at the connection to GraphQL.

This is the file where i create Apollo Server:

import { Meteor } from 'meteor/meteor';

import { createApolloServer } from 'meteor/apollo';
import schema from '/imports/api/schema'; 
import {
  graphql,
} from 'graphql';


Meteor.startup(() => {
	createApolloServer({
	  schema,
	});
});

This is schema.jsx where i make a connection to MongoDB:


// Mongo Connection
const mongo = require('promised-mongo').compatible();
const db = mongo('mongodb://localhost:27017/asimenia');

const aggeliesCollection   = db.collection('aggelies');
const categoriesCollection = db.collection('categories');

And after i initialze the schema and types and querys.

Again i want to mention that the issue happens only after i build the meteor app.
There are no issues when i run the app with meteor command (before build).

Please if anyone had same issue i would appreciate any help.

Thank you!

I noticed that the messages actualy apears when some query is executed.

I use reactJS for front end, so the queries are attached to React components.
Here is an example of one component that executes a graphql query:

import React, { Component } from 'react';
import { gql, graphql } from 'react-apollo';
import createFragment from 'react-addons-create-fragment';
 
import {Card, CardActions, CardHeader, CardMedia, CardTitle, CardText} from 'material-ui/Card';
import FlatButton from 'material-ui/FlatButton';

import JobCard from '../common/JobCard';

class LatestJobsList extends Component {

  constructor(props) {
    super(props);
    this.state = {
      expanded: false,
    };
  }

  render() {
    return (
      <section className="container">
             {this.props.data.latestAggelies==undefined 
               ? "Loading..." 
               : this.props.data.latestAggelies.map(aggelia => (
                  <JobCard key={aggelia.id} aggelia={aggelia} />
               ))
             }
      </section>
    );
  }
}

const MyQuery = gql`
  {
    latestAggelies: getLatestAggelies{
      id,
      category{
        title
      },
      subCategory{
        title
      },
      title,
      description,
      salary,
      region,
      created_at,
    } 
  }
`;

const LatestJobsListData = graphql(MyQuery,{
  options: { pollInterval: 5000 },
})(LatestJobsList);

export default LatestJobsListData;

This is the resolver:

      getLatestAggelies: {
        type: new GraphQLList(aggeliaType),
        resolve(root) {
          return aggeliesCollection.find().sort({created_at:-1}).limit(6).toArray();
        }
      },

And this is the aggeliaType:

const aggeliaType = new GraphQLObjectType({
  name: 'aggelia',
  fields: {
    id:         { type: GraphQLString },
    category:    { 
        type: new GraphQLList(categoryType),
        resolve: function(rootQuery){
          return categoriesCollection.find({title: rootQuery.category});
        }
     },
    subCategory:    { 
        type: new GraphQLList(categoryType),
        resolve: function(rootQuery){
          return categoriesCollection.find({title: rootQuery.subCategory});
        }
     },
    title:       { type: GraphQLString },
    description: { type: GraphQLString },
    salary:      { type: GraphQLFloat },
    region:      { type: GraphQLString },
    created_at:  { type: GraphQLString }
  }
})

And the last one categoryType:


const categoryType = new GraphQLObjectType({
  name: 'category',
  fields: {
    _id:                { type: GraphQLString },
    title:              { type: GraphQLString },
    description:        { type: GraphQLString },
    top:                { type: GraphQLString },
    parentCategory:     { type: GraphQLString },
    subCategoriesCount: { 
        type: GraphQLInt,
        resolve: function(rootQuery){
          return categoriesCollection.find({top: false, parentCategory: rootQuery.title}).count();
        }
     },    
    aggeliesCount: { 
        type: GraphQLInt,
        resolve: function(rootQuery){
          return aggeliesCollection.find({subCategory: rootQuery.title}).count();
        }
     },    
  }
})


So I’m still thinking it may be node version dependent.

The official version for Meteor 1.5 is 4.8.3. Any other version is at your risk :wink:

1 Like

Wow!

Thank you a lot. You were right.

I changed the NodeJS version to 4.8.3, rebuild the app and it worked.

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm
nvm install 4.8.3

1 Like