Support external directives

[Akryum]

Currently, writing client-side documents with the @client directive yields various errors in VS Code:

In this example, setShowSignIn is marked as not found in the schema, and @client as unknown directive.

More info on client-side GraphQL.

[divyenduz]

@Akryum : Thanks for raising this. You can supply customDirectives to language service via extension in graphql-config.

This needs to be documented properly though. Does this solve your issue?

[frandiox]

@divyenduz What would be the correct syntax? In YAML I'm writing this:

extensions:
  customDirectives:
    - client

No errors but hover stops working after using customDirectives like this 🤔

[divyenduz]

@frandiox : It has to be the full directive syntax. Try AST explorer, choose GraphQL, the AST should generate for a valid directive. For example,

Please let me know how that goes.

[frandiox]

@divyenduz No luck 😅 I'm not very familiar with AST so probably I'm doing something wrong. I've tried getting that tree in JSON format and converting it to YAML. It still says @client is invalid. Thanks for the answer anyway!

[divyenduz]

@frandiox : Sure, my intention was that if a valid AST is generated that means directive syntax is correct. What does your last attempt look like? I think it should be like

- directive @client on FIELD_DEFINITION

[frandiox]

@divyenduz I see, I misunderstood the explanation. This works:- directive @client on FIELD 🎉

The only error remaining is that @client queries/mutations are still validated against the app "remote" schema instead of the local apollo-link-state. Therefore, a mutation like setLocalUser is not found on the remote type Mutation. I guess this requires some big changes.

Thanks for your patience!

[divyenduz]

@frandiox : Thanks, that is a very interesting use can. Can you provide a minimal reproduction and create a separate issue for this? :)

[frandiox]

@divyenduz Hi again! I think the original post already describes these two problems so maybe there is no need to create another issue?

• @client is unknown: it can be declared as a custom directive in .graphqlconfig
• setShowSignIn is marked as not found in the schema: There's no solution for now. Perhaps the plugin should simply ignore it if @client is declared.

This is not very minimal but is the one I have at hand now: https://github.com/frandiox/vue-graphql-enterprise-boilerplate

.graphqlconfig can be found here and the example query with the errors here.

The @client directive is defined by apollo-link-state. Hope this helps!