Graphql-flutter: Subscription results to an error when the operation name is not exactly the same as subscription root field name

[baptisteArno]

Whenever I'm calling a Subscription widget, it won't try to connect to websocket. Nothing is printed out in console.

It gives me right away the error:
[{message: Unknown operation named "userJoinedRoom"., extensions: {code: INTERNAL_SERVER_ERROR, exception: {stacktrace: [GraphQLError: Unknown operation named "userJoinedRoom"

but it exists.

I made sure the websocket in my backend was running and working.

Here is my client config :

final sessionToken = await storage.read(key: 'session_token');
AuthLink _authLink = AuthLink(
   getToken: () async => 'Bearer $sessionToken',
);
HttpLink _httpLink = HttpLink(
  uri: '$backendUrl/graphql',
);

final WebSocketLink websocketLink = WebSocketLink(
  url: '$backendUrlWS/graphql',
  config: SocketClientConfig(
    autoReconnect: true,
    inactivityTimeout: Duration(seconds: 30),
  ),
);
Link _link = _authLink.concat(_httpLink).concat(websocketLink);

client = ValueNotifier(GraphQLClient(
  cache: InMemoryCache(),
  link: _link,
));

Any idea what could be wrong here ?

[mainawycliffe]

That error is from the server, can you share the schema for the server and your subscription query, please? On top of that, provide details on the version of this library you are using.

[baptisteArno]

I'm using apollo-server-express v2.9.3
graphql-flutter v2.1.0

The schema:

type Subscription {
    userJoinedRoom: Int
  }

The query:

r'''
  subscription UserJoined{
    userJoinedRoom
  }
'''

I tested out in GrahpiQL, it works. So, no error backend side. I'm using an ngrok tunnel. Could it cause a problem ?

[baptisteArno]

Here is how I implement the Subscription widget :

String userJoinedRoomQuery = r'''
  subscription UserJoined{
    userJoinedRoom
  }
'''
_appBarBuilder() => AppBar(
        title: Subscription('userJoinedRoom', userJoinedRoomQuery, builder: ({
          bool loading,
          dynamic payload,
          dynamic error,
        }) {
          print('payload : $payload');
          print('error : $error');
          if (payload != null) {
            return Text('I got something');
          } else {
            return Text("Didn't receive data");
          }
        }),
      );

With these prints :

I/flutter ( 4210): payload : null
I/flutter ( 4210): error : null
I/flutter ( 4210): payload : null
I/flutter ( 4210): error : [{message: Unknown operation named "userJoinedRoom"., extensions: {code: INTERNAL_SERVER_ERROR, exception: {stacktrace: [GraphQLError: Unknown operation named "userJoinedRoom".,     at buildExecutionContext (C:\Dev\turn-up\backend\node_modules\graphql\execution\execute.js:174:15),     at executeImpl (C:\Dev\turn-up\backend\node_modules\graphql\execution\execute.js:89:20),     at Object.execute (C:\Dev\turn-up\backend\node_modules\graphql\execution\execute.js:64:35),     at C:\Dev\turn-up\backend\node_modules\apollo-server-core\dist\requestPipeline.js:240:46,     at Generator.next (<anonymous>),     at C:\Dev\turn-up\backend\node_modules\apollo-server-core\dist\requestPipeline.js:8:71,     at new Promise (<anonymous>),     at __awaiter (C:\Dev\turn-up\backend\node_modules\apollo-server-core\dist\requestPipeline.js:4:12),     at execute (C:\Dev\turn-up\backend\node_modules\apollo-server-core\dist\requestPipeline.js:219:20),     at Object.<anonymous> (C:\Dev\turn-up\backend\node_modules\apollo-server-co

I just don't know how to debug this ...

[mainawycliffe]

I have been trying to replicate your error and I think I found it, I just need some confirmation from your end. Can you name the subscription operation same as the query itself like shown below and see if it works:

```graphql
String userJoinedRoomQuery = r'''
subscription UserJoinedRoom{
userJoinedRoom
}
'''
````

[baptisteArno]

String userJoinedRoomQuery = r'''
  subscription UserJoinedRoom{
    userJoinedRoom
  }
'''

It doesn't work. Why did you think it could be the problem ?

[baptisteArno]

When I run the star wars example on my current backend it says:

I/flutter ( 5341): Connecting to websocket: ws://10.0.2.2:4000/graphql...
I/flutter ( 5341): Connected to websocket.

I don't have this output on my app. But I have almost the same setup as the star wars example...

[baptisteArno]

Ok, you were right, I had to change the subscription name to the same as the query. So with a lower case 'u':

String userJoinedRoomQuery = r'''
  subscription userJoinedRoom{
    userJoinedRoom
  }
'''

This isn't a behavior we want, right ? This should work :

String userJoinedRoomQuery = r'''
  subscription AnythingIWant{
    userJoinedRoom
  }
'''

[mainawycliffe]

String userJoinedRoomQuery = r'''
  subscription UserJoinedRoom{
    userJoinedRoom
  }
'''

It doesn't work. Why did you think it could be the problem ?

The reason I thought that would work, is because I think I stumbled across a bug where I receive error "operation name not found" when the operation name is not the same as the subscription. I wanted to see of you were experiencing something similar.

The key is your query, the way its formulated. It doesn't return anything, I am guessing that GraphiQL might be adding somethings that our library isn't.

To test out this theory, can you use Curl to run the subscription and see what happens:

curl \
  -X POST \
  -H "Content-Type: application/json" \
  --data '{ "subscription userJoinedRoom": "{ userJoinedRoom }" }' \
  GRAPHQL_URL

[mainawycliffe]

Ok you were almost right, I had to change the subscription name to the same as the query. So with a lower case 'u':

String userJoinedRoomQuery = r'''
  subscription userJoinedRoom{
    userJoinedRoom
  }
'''

This isn't a behavior we want, right ? This should work :

String userJoinedRoomQuery = r'''
  subscription AnythingIWant{
    userJoinedRoom
  }
'''

Yes, this is a bug, which seems to affect Subscriptions and not other types of GraphQL Operations.

[baptisteArno]

Thank you very much for your time @mainawycliffe 🙏

[micimize]

subscriptions were substantially reworked in 4.0.0-beta, so I'm guessing this issue is actually resolved (from what I can gather)