Client.query not Returning Result?

Help
, ,
1

I’m updating my app to use apollo-server-express. My client is successfully connecting to my resolver. However, the resolver result is not yet coming back to the client.

Client Query

useEffect(() => {
	if (!!Meteor.user()) {
		debugger; //<== IS ACTIVATED
		client.query({
			query: USERDATA_QUERY,
			variables: {userId: Meteor.userId()},
			fetchPolicy: 'network-only',
		}).then((result) => {
			debugger; //<== IS NEVER ACTIVATED
			console.log('cp #1')
			[.....]
	}
}, [Meteor.userId()]);

Apollo Server Setup

import { ApolloServer } from 'apollo-server-express';
import { WebApp } from 'meteor/webapp';
import { getUser } from 'meteor/apollo';
import typeDefs from "./api/schema.graphql";
import {getUserData, resolvers} from "./api/resolvers";

const server = new ApolloServer({
    typeDefs,
    resolvers,
    context: async ({ req }) => ({
        user: await getUser(req.headers.authorization)
    })
});

export async function startApolloServer() {
    await server.start();
    const app = WebApp.connectHandlers;

    server.applyMiddleware({
        app,
        cors: true
    });
}

Apollo Client Setup

import React from 'react';
import { InMemoryCache, ApolloProvider, ApolloClient, ApolloLink } from '@apollo/client';
import { BatchHttpLink } from '@apollo/client/link/batch-http'
import { MeteorAccountsLink } from 'meteor/apollo'

const cache = new InMemoryCache();

const link = ApolloLink.from([
    MeteorAccountsLink(),
    new BatchHttpLink({
        uri: '/graphql'
    })
]);

const client = new ApolloClient({
    uri: '/graphql',
    cache,
    link,
});

export default client;

Resolver

epUserData: async (parent, args, context) => {
	const userId = context.user._id;

	return Promise.resolve()
		.then(() => {
			var epUsers = connectors.epUserData.findAll({where: args}).then((epUsers) => epUsers.map((item) => item.dataValues));
			return epUsers;
		})
		.then(epUsers => {
			return epUsers; //<== CHECKED -- DOES CONTAIN EXPECTED DATA
		})
		.catch((err) => {
			console.log(err);
		});
},

Query

const USERDATA_QUERY = gql`
    query ($userId: String!) {
        epUserData(id: $userId) {
            name_title
            name_first
            name_last
            id
            admin_status
        }
    }`;

What am I missing?

2

I guess first things first…have you verified that your request is being successfully processed on the express side?

3

Whoa! I can see in Firefox dev tools Network inspector->Response that the data from the resolver is correctly showing up in the client!

But the then block of my client.query call isn’t running:

useEffect(() => {
	if (!!Meteor.user()) {
		debugger; //<== is activated
		client.query({
			query: USERDATA_QUERY,
			variables: {userId: Meteor.userId()},
			fetchPolicy: 'network-only',
		}).then((result) => {
			debugger; //<== IS NEVER ACTIVATED
			console.log('cp #1')
			[.....]
	}
}, [Meteor.userId()]);

What could cause that?

4

Hard to say just from what you’ve posted. Any errors in your client after the response comes back?

5

Great question. I updated the code to have a .catch(err => block and there was a very helpful error:

userData is not defined

So with that info I was able to solve it.

There was a field resolver that was referencing a variable called userData that was available in my code, with the previous Apollo server setup, but hadn’t yet been implemented in my code that is using apollo-server-express.