Why is the Query call to server multiple times

[chicrock]

Describe the bug
The Query Widget call to server multiple times.
When I used the FetchPolicy.cacheAndNetwork, I understand the twice builder call.
But, in my case, the builder method is calling three times and sometimes calls more.

To Reproduce
Steps to reproduce the behavior:

# my code
@override
Widget build(BuildContext context) {
  print('build');
  
  return Query(
    options: {
      ...
      fetchPolicy: FetchPolicy.cacheAndNetwork,
      ...
},
    builder: (QueryResult result, {Refetch refetch, FetchMore fetchMore}) {
      if (result.loading ) {
        return Loader();
      }

      if (result.hasException) {
          return Container();
      }

      print('builder');
      ...
    },
  );
}

Expected behavior
Call one time to server.

Screenshots

# in console
flutter: build
flutter: builder
flutter: builder
flutter: builder

# in server console
...
app:GetGroupLabels resolver +6ms
...
app:GetGroupLabels resolver +2ms
...
POST /graphql 200 12.968 ms - 893
POST /graphql 200 15.661 ms - 893

Desktop (please complete the following information):

• OS: MacOS
• Version 10.14

Smartphone (please complete the following information):

• Device: iPhone8
• OS: iOS12.2

Additional context
Add any other context about the problem here.

[caleblawrence]

I'm having the same issue. I have a query calling 3 times in a row and causing a problem. I could be doing something wrong but I can't figure it out.

At first I thought it might be related to this: #121 but I don't think it is because I can see that it's hitting the network 3 times with the same exact request based on the logging in my server.

This is an issue because when I first load a page I make a mutation to update a couple things but I don't want to show the updates until the next time the page is visited. However because it calls the endpoint multiple times this does not work.

[chungwong]

Are you guys using Navigator?
I found it is true that it fetches multiple times when route changes and also on App Drawer closing as well.

[chicrock]

@chungwong Yes, I use Navigator with MaterialPageRoute.
And last night, I found the rebuild issue causing by MaterialPageRoute.
In my case, Changed the maintaionState of MaterialPageRoute props to false was solved this issue.

I ignored the prev screen's behavior.

[chungwong]

I believe it is more than just related to MaterialPageRoute

There is already a PR addressing this issue.
#533

[peupompeu]

I am facing the same problem, the build being done two times it´s expected. But the query being done to server multiple times is a problem and i cant figure out why.

[chicrock]

@pepomps Do you use MaterialPageRoute ?
In my case, the background pages in MaterialPageRoute was rebuilding when the global states changing like page navigation.
If you use MaterialPageRoute, what about check the maintaionState of MaterialPageRoute props ?

[peupompeu]

@chicrok I just implemented your solution, the problem was in MaterialPageRout, now it's working! thanks for the help!!

[joseignaciopergolesi]

I have the same problem and I don't know how to solve it.
Can you explain a little more in detail?
Please
I am using the graphql_flutter version: ^ 2.1.1-beta.5

[joseignaciopergolesi]

Sorry, could you show an example of how to make a query and not to do it three times?
I still can't do it with version 3.1.0-beta.2

It doesn't work for me using the latest beta version of the package. Could you upload an example of how to make a query using the wiget Query and not make three requests to the server?
Thank you

[chicrock]

@joseignaciopergolesi Did you play this ? (#575 (comment))
In my case, MaterialPageRoute caused this problem..

[nivekz]

We found another bug that causes queries to be run multiple times in certain cases despite the fix in #533. That happens when:

1. Query is rebuilt by the parent. In the context of Navigator push/pop, this happens when Query has a stateful ancestor since every state seems to be built again when push/pop. See Pages on Navigator stack rebuild when a new page is pushed flutter/flutter#11655
2. QueryState.didUpdateWidget is called, and it tries to compare the old and new options to decide whether to rebuild ObservableQuery.
3. Here is the actual bug: WatchQueryOptions.areEqualTo() does not consider default policy overrides. So when a query does not have fetch or error policies set, the equality check will fail, causing ObservableQuery to be rebuilt.

[dasarijit88]

I still face the problem . I am using graphql_flutter: ^4.0.1. I can see the solution is marked to make maintainState of MaterialPageRoute false. But where do I do that? My code looks like below: Please help. Its calling three times to server.

`

@OverRide
Widget build(BuildContext context) {

  return Consumer<Auth>(builder:
      (final BuildContext context, final Auth auth, final Widget child) {
    return MaterialApp(
        title: 'My App',
        debugShowCheckedModeBanner: false,
        theme: ThemeData(
            primarySwatch: Colors.green,
            visualDensity: VisualDensity.adaptivePlatformDensity),
        initialRoute: '/',
         routes: {
           '/auth': (context) => AuthScreen(),
          '/main': (context) => MainScreen(),
           '/home': (context) => HomeScreen(),
          '/homeauth': (context) => HomeAuth(),
   

         },
        home: auth.isAuth
            ? HomeAuth()
            : 
            FutureBuilder(
                future: auth.tryAutoLogin(),
                builder: (ctx, authResultSnapshot) =>
                    authResultSnapshot.connectionState ==
                            ConnectionState.waiting
                        ? SplashScreen()
                        : AuthScreen(),
              ));
  });

}
}

class HomeAuth extends StatelessWidget {
@OverRide
Widget build(BuildContext context) {
return Config.config(param: HomeAuthTabScreen());
}
}

class HomeAuthTabScreen extends StatefulWidget {

@OverRide
_HomeAuthTabScreenState createState() => _HomeAuthTabScreenState();
}

class _HomeAuthTabScreenState extends State {

}

final String _query = """
query getData{
Student {
name
id
address {
city
street
number
zipCode
}
}

""";

@OverRide
Widget build(
BuildContext context,
) {

print("Before Query is fired");
return Container(
  color: Colors.white
  child: 
  Query(
      options: QueryOptions(
        document: gql(_query),
      ),
      builder: (QueryResult result,
          {VoidCallback refetch, FetchMore fetchMore})   {
        if (result.hasException) {
          print(result.exception);

        }
        if (result.isLoading) {
          return Center(child: CupertinoActivityIndicator());
        }

print("After Query is fired");

        return 
         
             Container(child: Center(child: Text("Testing")));
            
       
      }),
          );

}
}
`

[vincenzopalazzo]

Hi @dasarijit88

before being driven with time in your issue you need to do the following things:

• Upgrade to the last version 5.0.1-beta.3
• Try to reproduce your problem with a simple example, this can help you to check if the error is in your code
• open a new issue with the previous example if you continue to have this error.

Thanks

[dasarijit88]

I have upgraded to version 5.0.1-beta.3 but still getting the issue. As per suggestion opened a new issue. #1011

[marc-wilson]

Stil happening in 5.2.0-beta.6