apollo-link-rest: GraphIQL + ApolloDevTools -- "TypeError: forward is not a function"

Hiya,

I’ve been encountering the same error every time I’ve used apollo-link-rest: opening up GraphiQL in the Apollo devtools always shows a “TypeError: forward is not a function” error. The full text of the error:

{ "errors": [ { "message": "forward is not a function", "locations": [ "TypeError: forward is not a function\n at RestLink../node_modules/apollo-link-rest/bundle.umd.js.RestLink.request (http://localhost:3000/static/js/bundle.js:5566:24)\n at http://localhost:3000/static/js/bundle.js:5746:33\n at ApolloLink.request (http://localhost:3000/static/js/bundle.js:2602:20)\n at ApolloLink.request (http://localhost:3000/static/js/bundle.js:5745:31)\n at chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:3681\n at e.request (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:38654)\n at chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:3681\n at e.request (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:38421)\n at chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:3681\n at chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:38085\n at new s (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:4855)\n at l.subscribe (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:6185)\n at n.<anonymous> (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:38914)\n at n.t.emit (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:52786)\n at chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:19519\n at n (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/backend.js:1:36148)" ] } ] }

Queries and mutations with the @rest directive seem to be working fine and do not throw any other errors, so it’s not a completely blocking issue, but it does potentially affect some other Apollo Client capabilities e.g. trying to use the @client directive does not work and throws the same error (as the error payload in a <Query> component from react-apollo).

I cloned the three example react-apollo projects (simple, advanced, typescript) and the same error appears in all three. #121 references this issue but there does not appear to be a fix; the fix that is included is for a separate “failed to fetch” bug. There is also a mention of a missing @rest or @client directive as a potential cause, but as mentioned this is happening with the sample projects as well as my own so I don’t think a missing directive is the culprit.

To reproduce, just clone the example projects, install and start and open up Apollo dev tools in Chrome (current version I’m having this error in is 70.0.3538.77).

Thanks for looking at this, love the package and find it incredibly useful!

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 6
  • Comments: 20

Most upvoted comments

Not sure if this is exactly related to the use case as everyone above, but this is the only relevant search result I could find with the error I was getting that I eventually solved.

I recently ran into this error when I was trying to add apollo-link-rest to an existing application using @apollo/client.

tl;dr The problem turned out to be that you can’t pass both uri and link as option parameters when defining a new ApolloCient. Instead, you must remove the uri parameter and create an HttpLink using createHttpLink and then use from() to combine your links and them to the link option parameter.

Before I added the rest link, this is what my definition looked like:

import { ApolloClient, InMemoryCache } from '@apollo/client';

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

On reading the documentation, I was under the impression that I should be able to add a rest link by defining a new RestLink and adding the additional link parameter to my options like this:

import { ApolloClient, InMemoryCache } from '@apollo/client';
import { RestLink } from 'apollo-link-rest';

const restLink = new RestLink({
  uri: '/api',
});

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

However, this configuration caused the TypeError: forward is not a function error to occur and the client to no longer work.

After reading further into the documentation on links, I realized (though I couldn’t see it explicitly said, and there may be cases where this is incorrect) that you can’t use the uri and link option parameters in the ApolloClient definition at the same time. Using this new info I was able to fix the issue by removing the uri parameter and creating an HttpLink that I then combined with by RestLink using from() and everything finally worked (note that as per the documentation, the RestLink should go before the HttpLink):

import {
  ApolloClient, InMemoryCache, from, createHttpLink,
} from '@apollo/client';
import { RestLink } from 'apollo-link-rest';
const httpLink = createHttpLink({
  uri: '/api/graphql',
});

const restLink = new RestLink({
  uri: '/api',
});

const client = new ApolloClient({
  cache: new InMemoryCache(),
  link: from([restLink, httpLink]),
});

Hi! I was able to look a little bit into what is causing this issue. It looks like this operation get called by the apollo-client-devtools.

When it gets here however, forward is undefined.

I’m not entirely sure how this all works otherwise I would make a PR to fix the issue. When I did change the !isRestQuery check to !isRestQuery && forward I was able to silence the above error. However, I got a new error:

Error: Type Query must define one or more fields.
    at t.assertValidSchema (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/devtools.js:1:258433)
    at O (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/devtools.js:1:272246)
    at k (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/devtools.js:1:271277)
    at t.execute (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/devtools.js:1:270565)
    at t.v (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/devtools.js:1:806774)
    at t.n.emit (chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/devtools.js:1:394893)
    at chrome-extension://jdkknkkbebbapilgoeccciglkfbmbnfm/dist/devtools.js:1:517657

Here’s an example app that I used to see/debug this issue: https://github.com/Hilaryous/simple-react-app/tree/apollo-link-rest-example.

Thank you for all your work on this library. If I can help in any way I’m glad to do so.

@heymanhn – Yes ApolloLinkRest is being actively developed. But this is open source. I’m happy to help you get a PR tested & delivered, but I don’t have experience with ApolloDevTools.

We need somebody who does, or is willing to dive into their codebase to figure out what’s necessary to be compatible with it. I challenge you to figure out what’s missing and I’d love to support your contributions!

I want to be clear, that I don’t know that apollo-link-rest ever worked with ApolloDevTools, so I’d say this is less of a breakage, and more of a missing desired feature.

Additionally, I personally use apollo-link-rest with React-Native, and back a year ago, ApolloDevTools wasn’t compatible with React-Native.

They’ve since announced that they fixed that, but I haven’t been able to activate ApolloDevTools for my team’s react-native project, so I don’t know what’s wrong there.

thanks @crbanman you saved my day! 💯

I don’t know what the documentation explorer needs for support of apollo-link-rest but it wouldn’t surprise me if there’s work to do, and/or it will never work well. Accepting PRs if work is needed here!

Scrolling the cache view definitely seems like a bug in the ApolloDevTools code,

But I’m glad you’ve made progress @edgars-sirokovs !

I’m running into this recently and have narrowed the error is my case to the IntrospectionQuery, which is I believe graphiql/devtools querying the graphql server for the schema? Problem is, I’m only using apollo-client and apollo-link-rest, so there isn’t a server or schema, except for the cache schema (if there is one). In turn, my apollo devtools is blank. Not exactly sure what the fix here would be, everything worked at one point.

I’m experiencing the same thing. @cgatian yes, my cache panel is empty.

It’s hard to embrace apollo’s toolchain when these breakages occur for so long. Is apollo-link-rest still being actively worked on?