useSuspenseQuery with skipToken still issues network request about apollo-client HOT 8 CLOSED

Using skipToken in that manner will immediately put the query into fetchPolicy: "standby", which should never issue a network request.

This is highly curious. Could you provide us with a reproduction showing that happening?

from apollo-client.

I have figured out that the problem has to do with <React.StrictMode> somehow (StrictMode causes render functions to be called twice, among other things). Without StrictMode, the skipping works as intended. Under StrictMode, both skipToken and {skip: true} seem to not result in skipping.

The repro seems to be as simple as:

const client = new ApolloClient({
  uri: "/graphql",
  connectToDevTools: true,
  cache: new InMemoryCache(),
});

ReactDOM.createRoot(document.getElementById("root")!).render(
  <React.StrictMode>
    <ApolloProvider client={client}>
      <DummyComponent />
    </ApolloProvider>
  </React.StrictMode>,
);

export const DummyComponent: React.FunctionComponent<
  PropsWithChildren<unknown>
> = ({children}) => {
  console.log("!!! DummyComponent render");
  let data: GetSpecQuery;
  const {data: res} = useQuery(GET_BINARIES, skipToken);
  console.log("!!! DummyComponent. data: ", res);

  return <>DummyComponent</>;
};

FWIW, useQuery with {skip: true} works fine (including under StrictMode).

Please tell me if this doesn't repro and I'll work on packaging it somehow.

from apollo-client.

@andreimatei out of curiosity, is this reproducible using version 3.9.9? Also in the code snippet above, I'm assuming you meant {skip: true} instead of skipToken as being passed to useQuery? As useQuery does not accept skipToken.

from apollo-client.

out of curiosity, is this reproducible using version 3.9.9?

No, it does not seem to reproduce on 3.9.9! So the issue seems to have been introduced in 3.9.10. Going back and forth between these two versions reliably introduces and removes the problem.

Also in the code snippet above, I'm assuming you meant {skip: true} instead of skipToken as being passed to useQuery? As useQuery does not accept skipToken.

Sorry, the snippet was supposed to use useSuspenseQuery. It was supposed to be

export const DummyComponent: React.FunctionComponent<
  PropsWithChildren<unknown>
> = ({children}) => {
  console.log("!!! DummyComponent render");
  let data: GetSpecQuery;
  const {data: res} = useSuspenseQuery(GET_BINARIES, skipToken);
  console.log("!!! DummyComponent. data: ", res);

  return <>DummyComponent</>;
};

useQuery works fine.

from apollo-client.

Thanks for confirming that, @andreimatei! I believe @jerelmiller has some thoughts here on how to reconcile the fix we shipped in 3.9.10 with the issue you're seeing. We're also working on releasing 3.10 this week, so I can't give a precise timeline on the fix here, but we're looking into it. Thanks!

from apollo-client.

167 useSuspenseQuery tests and this wasn't one of them 😂. Thanks for reporting!

from apollo-client.

Do you have any feedback for the maintainers? Please tell us by taking a one-minute survey. Your responses will help us understand Apollo Client usage and allow us to serve you better.

from apollo-client.

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
For general questions, we recommend using StackOverflow or our discord server.

from apollo-client.