Context cancelled when using @defer

[Adam-Mustafa]

What happened?

I upgraded to the latest gqlgen generator and am attempting to use a defer directive in a query. The request works fine without the directive. When I used the directive, the initial response is as expected, "totalValue" is null and "hasNext" is included and is true. When I log the "totalValue" resolver, it is saying that the incoming context is cancelled. Attempted to use a new context just to get through the error and it still doesn't return anything to the caller.

{ 
  userAccountPortfolio {
        id
        ... TotalValue @defer
  }
}

fragment TotalValue on UserAccountPortfolio {
  totalValue
}

I'm did this through the included graphql playground as well as through the @apollo/client.

What did you expect?

I expected the call to complete will the non-deferred data and then the deferred data to be returned in a second response. Here is the PR I'm modelling the expectation from: #2642 by @StevenACoffman

Minimal graphql.schema and models to reproduce

query {
  userAccountPortfolio: UserAccountPortfolio
}

type UserAccountPortfolio {
    id 
}

extend type UserAccountPortfolio {
  totalValue: Float     @goField(forceResolver: true)
}

versions

• gqlgen version: v0.17.36
• go version: 1.19.11

[UnAfraid]

Hi Adam,

When the support for defer was implemented, apollo/client had a lot of bugs, urql worked fine on another hand.
Also defer requires either SSE (Server Sent Events) or WebSocket transports.
I am not sure if gqlgen supports defer over http multipart

Here is patched version of the GraphiQL playground that supports SSE and defer works properly https://gist.github.com/UnAfraid/c2f9ed63332c47a2d588213fdbcfd688

[Adam-Mustafa]

Thanks for the help!

I tried the script you sent but it keeps giving me

{
  "errors": [
    {
      "name": "NetworkError",
      "message": "Connection closed while having active streams",
      "stack": "NetworkError: Connection closed while having active streams\n    at https://unpkg.com/graphql-sse/umd/graphql-sse.js:774:29"
    }
  ]
}

I do have the transports added:

	gqlServer.AddTransport(&transport.Websocket{
		KeepAlivePingInterval: 10 * time.Second,
		Upgrader: websocket.Upgrader{
			CheckOrigin: func(r *http.Request) bool {
				// Check against your desired domains here
				// return r.Host == "example.org"
				return true
			},
			ReadBufferSize:  1024,
			WriteBufferSize: 1024,
		},
	})
	gqlServer.AddTransport(transport.SSE{})
	gqlServer.AddTransport(transport.Options{})
	gqlServer.AddTransport(transport.GET{})
	gqlServer.AddTransport(transport.POST{})
	gqlServer.AddTransport(transport.MultipartForm{}) // <=== tried with and without this. 

I'll try to dig into this more deeply in a couple of weeks when I get another chance.

[UnAfraid]

Here is an example i just tested and it works for me https://github.com/UnAfraid/wg-ui/blob/master/pkg/api/router.go#L65-L79.

	gqlHandler := gqlhandler.New(exec.NewExecutableSchema(executableSchemaConfig))
	gqlHandler.AddTransport(transport.Websocket{
		InitFunc:              authHandler.WebsocketMiddleware(),
		KeepAlivePingInterval: 10 * time.Second,
		Upgrader: websocket.Upgrader{
			CheckOrigin: func(r *http.Request) bool {
				return checkOrigin(r, conf.SubscriptionAllowedOrigins)
			},
		},
	})
	gqlHandler.AddTransport(transport.SSE{})
	gqlHandler.AddTransport(transport.Options{})
	gqlHandler.AddTransport(transport.GET{})
	gqlHandler.AddTransport(transport.POST{})
	gqlHandler.AddTransport(transport.MultipartForm{})

You can test with curl to make sure server replies with SSE

curl 'http://localhost:8080/query' \
  -H "Authorization: Bearer $AUTH_TOKEN" \
  -H 'Connection: keep-alive' \
  -H 'accept: text/event-stream' \
  -H 'content-type: application/json; charset=utf-8' \
  --data-raw '{"query":"query users {\n  users{\n    ... user @defer\n  }\n}\n\nfragment user on User {\n  id\n  servers {\n    ... on Server @defer {\n      id\n    }\n  }\n}","operationName":"users"}'

The response should be similar to that

:

event: next
data: {"data":{"users":[{"id":"VXNlcjoxNjVhZDY0Mi00ZGRmLTQ2M2ItYmUxNy1lMzUyYWQ5MzEzYmY=","servers":null},{"id":"VXNlcjo1NjRiYzIzNi1kMTYyLTQyN2MtOGM0NC02NmYzMTJhNWY2NGU=","servers":null}]},"hasNext":true}

event: next
data: {"data":{"servers":null},"path":["users",1],"hasNext":true}

event: next
data: {"data":{"servers":[{"id":"U2VydmVyOmJkZDc5ZDdkLThhODMtNDQzMy05NTgxLTViMjhmY2RmNGUwMg=="}]},"path":["users",0],"hasNext":false}

event: complete

Here is the result in graphiql