apollographql/apollo-client

Cannot set property 'networkStatus' of undefined error occurs when fetchMore gets called

Closed this issue ยท 18 comments

Intended outcome:

I'm trying to use fetchMore function that is described at your documentation. link : https://www.apollographql.com/docs/angular/recipes/pagination.html#fetch-more

below is the actual code :

this.fetchQuery = this.apollo.watchQuery<any>({
      query: gql`
          query FetchTrainingData ($projectId: String!, $label: String, $page: Int, $size:Int, $order: OrderType){
              trainingData(projectId: $projectId, label: $label, page: $page, size:$size, order: $order) {
                  sentence
                  labels
                  id
                  updateCount
              }
          }
      `,
      variables: {
        projectId: "",
        page: null,
        label: null,
        order: null,
        size: null
      }
    });

this.fetchQuery.fetchMore({
      variables: {
        projectId: this.projectId,
        label: null,
        page: page,
        size: size,
        order: null
      },
      updateQuery: (prev, { fetchMoreResult }) => {
        if (!fetchMoreResult) { return prev; }
        return Object.assign({}, prev, {
          feed: [...prev.feed, ...fetchMoreResult.feed],
        });
      },
    }).then(res => {
      console.log(res);
    })

but when fetchMore gets invoked, "Cannot set property 'networkStatus' of undefined" error occurs.

ps. After the 2.0.0 releases your documentations are very unstable .Inside the example code about usage of fetchMore(above link) there is no such "this.feedObs" property. Maybe you guys meant "this.feedQuery". And also the "forceFetch" property inside watchquery options does not exist in type WatchQueryOptions & TypedVariables.

Actual outcome:

2017-11-10 11 31 03

2017-11-10 11 31 27

How to reproduce the issue:

Version

"apollo-angular": "1.0.0-beta.2",
    "apollo-angular-link-http": "1.0.0-beta.5",
    "apollo-cache-inmemory": "1.1.0",
    "apollo-client": "^2.0.2",
    "apollo-link-context": "1.0.0"

@pycraft114 could you create a reproduction for this to help me isolate what is not working?

@jbaxleyiii Do you guys provide any boilerplate code for plunker? like for the minimal settings to demonstrate? the.fetchQuery.fetchMore function gets called whenever i click a specific button and i assume the error occurs from this.obsQuery.fetchMore(fetchMoreOptions) inside QueryRef.js script

I'm having this same issue. I'm using apollo client with react native. To reproduce the issue do the following:

  1. do any fetchMore request without network. The apollo client throws a network error (Which is supposed to happen)
  2. After the network error do another fetchMore, this time the error which says "TypeError: Cannot set property 'networkStatus' of undefined" occurs. From what I see the problem is occurring at the code which says "this.store[query.fetchMoreForQueryId].networkStatus = exports.NetworkStatus.fetchMore;
    and this.store doesn't have anythings at the location of index fetchMoreForQueryId. IMO there is something happening when a network error occurs.

Same as #2533

@sondremare how could this be same with that??
modifying network status intentionally has nothing to do with this issue, unlike #2533

After reading @alewiahmed's comment, It appears to be the same

@sondremare is right, it's the same issue. When you first send a request & that request fails, a normal network error is thrown, but then when you send the fetchMore request the Cannot set property 'networkStatus' of undefined error occurs.

@alewiahmed - I'm having the same issue. After one request fails, there is no way to make the second one as the aforementioned error occurs.

Is there a plan to fix this?

is there any update to this issue im still facing this even when i use the solution here #2513 only patches refetch i think

hey guys, @seanyu4296 @DeviousM @pycraft114, this worked for me. you'll need both steps.

  1. I upgraded react apollo to 2.1.0.beta.0 (the current react apollo pre release): this is because we need apollographql/react-apollo#1531
  2. There is this pull request #2906, if it got merged good, but if not it's just a one liner, just edit the bundle.umd.js file of apollo-client to exactly like the pull request.
    I hope that helps.

@alewiahmed - thanks for the tip, but unfortunately I can't edit built library as our CI is downloading it on it's own (therefore there's no feasible way to do it properly this way).
But there's a hope though, that it will be done ๐Ÿ˜„

We @alewiahmed both have the same problem since i also use a CI, but i might try to fork to apply the patch.

Thanks for sharing your @alewiahmed step by step fix so far it seems to work in my project.

No problem at all @seanyu4296 . I'm glad that helped. quick question. After I upgraded to the 2.1 beta all other errors thrown by my app are thrown as a network error. Did you by an chance get that type of behavior? Thanks.

I still have this in 2.1.4

This issue should be fixed in modern versions of apollo-client. If anyone is still encountering this issue using apollo-client 2.3.7 (or higher), please let us know. Thanks!

Still have it in apollo-client 2.3.7