vuejs / apollo

🚀 Apollo/GraphQL integration for VueJS

Home Page:http://apollo.vuejs.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Queries are not executed in given order

leje512 opened this issue · comments

commented

Describe the bug
I've been debugging an application where the skip was not evaluated correctly and stumbled upon the issue of the queries being called randomly. I expected the queries to be called in the order in which I defined them, as its written in #430 too. In my project a lot of queries are dependent on values of other queries and if these are called before the other value, they will return wrong results as they use old values. I tried to debug this and initialized a minimal reproduction to find out how the order is defined: https://codesandbox.io/p/sandbox/nervous-voice-4kkyq8

apollo: {
    user: {
      query: ...,
      skip() {
        console.log("should skip user?", !this.id);
        return !this.id;
      },
      variables() {
        console.log("calls user", this.id);
        return {
          id: this.id,
        };
      },
      fetchPolicy: "cache-and-network",
    },
    post: {
      query: ...,
      skip() {
        console.log("should skip post?", !this.id);
        return !this.id;
      },
      variables() {
        console.log("calls post", this.id);
        return {
          id: this.id,
        };
      },
      fetchPolicy: "cache-and-network",
    },
  },

The current order is (most of the time):

  1. evaluate user skip()
  2. call user query
  3. evaluate post skip()
  4. call post query
  5. evaluate user skip()
  6. call post query
  7. evaluate post skip()
  8. call user query

Expected behavior
The order should be used to execute the queries. So in this example:

  1. evaluate user skip()
  2. call user query
  3. evaluate post skip()
  4. call post query
  5. evaluate user skip()
  6. call user query
  7. evaluate post skip()
  8. call post query

If this is not a bug a possibilty would be to add an (optional) order property to the queries, in which they should get executed:) Thank you for your help!

Versions
vue: 3.2.45 (Options API)
vue-apollo: 4.0.0
@apollo/client: 3.9.2