graphql / graphql/graphiql

[vscode-graphql-syntax] Incorrect syntax highlighting after empty type implementing interface

Open
#3,454 1 comment 1 reaction 0 assignees View on GitHub
bug vscode-graphql-syntax
Dominant language
TypeScript
Stars
16.9k
Forks
1.9k
Avg merge
22h 45m
Merged PRs (30d)
70

Description

### Current Behavior

After defining a type that implements an interface and which doesn't have a fields definition, the syntax highlighting breaks:

![image](https://github.com/graphql/graphiql/assets/12209111/2ced6f1b-939d-4973-98d3-5869e1faa98b)

In this example you can see there's a difference in the syntax highlighting for the first object definition for `Test` and the second object definition for `Test` in the `type` keyword.

### Expected Behavior

I would expect the syntax highlighting to be the same in both cases.

### Possible fix

I noticed in [graphql.json:79](https://github.com/graphql/graphiql/blob/e1ee54ee74e3518d46dedcb8fdb90b0169492849/packages/vscode-graphql-syntax/grammars/graphql.json#L79) that the regex for `end` is looking for a `{` symbol. [The GraphQL Specs](https://spec.graphql.org/October2021/#ObjectTypeDefinition) define the `{` symbol (part of fields definition) to be optional, making the regex incorrect.

I feel like the end regex should be a lookahead for a whitespace character. This would only highlight the `implements` keyword, but I think that's what's expected? If the definition itself should include the actual type defined (after the `implements` keyword), it could be a lookahead for whitespace character, that's not after a comma (to correctly highlight `type Test implements InterfaceOne, InterfaceTwo`).

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.