This is my functional component that makes use of useQuery from @apollo/client:

function MyComponent(props) {
  const { data } = useQuery<MarketScannerSearchProps>(
    MARKET_SCANNER_SEARCH_PROPS_QUERY,
    {
      onCompleted: (data) => {
        console.log("completed", data)
      },
    }
  )
  console.log("data", data)

  // ... rest of function + return rendered result
}

I get this in my console:

data undefined
data undefined

completed {marketScannerSearchProps: {…}}

why isn't there a data {marketScannerSearchProps: {…}} at the end?

This is not always reproducible, only happens every 5th reload or so of my app. This is how it looks when it works:

data undefined
data {marketScannerSearchProps: {…}}
completed {marketScannerSearchProps: {…}}

So somehow the 2nd time the component is rendered the data is there, but not always, and if the data isn't there by the 2nd render, it never updates it afterwards.

Shouldn't apollo trigger a re-render every time once the query completes? What am I missing here?

EDIT: I think this issue might be gone now. I closed and opened Chrome Dev Tools a few times, and now it seems to be gone. Could it be Apollo client side caching getting messed up?