onServerPrefetch() should check if result is already filled

[fabis94]

Describe the bug
I'm using @vue/apollo-composable in a Vue 3/Nuxt 3 project and I am running into a strange issue where a page of mine never loads - it just keeps loading indefinitely. After some extensive debugging into the internals of Nuxt, Vue and then Vue Apollo (which took me hours!) I found out that the issue occurs somewhere here:

apollo/packages/vue-apollo-composable/src/useQuery.ts

Lines 174 to 189 in 3728928

	vm && onServerPrefetch?.(() => {
	if (!isEnabled.value || (isServer && currentOptions.value?.prefetch === false)) return
	return new Promise<void>((resolve, reject) => {
	firstResolve = () => {
	resolve()
	firstResolve = undefined
	firstReject = undefined
	}
	firstReject = (apolloError: ApolloError) => {
	reject(apolloError)
	firstResolve = undefined
	firstReject = undefined
	}
	}).then(stop).catch(stop)
	})

It returns a new Promise that defines firstResolve and firstReject, but to my surprise the result ref was already filled!

apollo/packages/vue-apollo-composable/src/useQuery.ts

Line 157 in 3728928

const result = ref<TResult | undefined>()

Meaning - onNextResult had already ran, filled result and tried to invoke firstResolve, befure it was even defined!

A fix should be trivial and I can offer to create a PR - inside the onServerPrefetch hook check first if the result ref is already filled before returning a new Promise!

To Reproduce
Set up this commit: specklesystems/speckle-server@daea17d

1. Checkout repo & branch
2. cd ./packages/frontend-2
3. create .env file from .env.example and set API_ORIGIN to be https://speckle.xyz/graphql
4. yarn dev to run the app
5. try to open http://localhost:8081/auth-only in the browser, the page will never finish loading!
6. if that works try http://localhost:8081/guest-only (it depends on if ur logged in or not)

(you can login through /login, and registration occurs on https://speckle.xyz)

Sorry for the complicated setup, but these kinds of issues are often hard to replicate on basic replication repos. I'm open to fix this myself as long as someone can give me the go-ahead and will approve my changes!

Expected behavior
onServerPrefetch should check if the results have already arrived instead of always returning a promise that might never resolve

Versions
vue: 3.2.44
@vue/apollo-composable: 4.0.0-beta.1
@apollo/client: 3.7.0

Additional context

[fabis94]

i've created a PR with an initial version of the fix, let me know if I should change anything #1435

I've tested it out locally through symlinks and it resolves the issue!

[didimitrie]

Bumping this one up. This is limiting us in a different project we're working on (same stack), and, while it doesn't block us, it does make things difficult (and making us regret some of our choices 😅).