starred/hoppscotch

Fork 0

mirror of https://github.com/hoppscotch/hoppscotch.git synced 2026-04-26 09:16:03 +03:00

[GH-ISSUE #741] Add GraphQL syntax highlighting #255

New issue

Closed

opened 2026-03-16 14:15:30 +03:00 by kerem · 4 comments

kerem commented

2026-03-16 14:15:30 +03:00

Owner

Originally created by @danilofuchs on GitHub (Apr 5, 2020).
Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/741

Originally assigned to: @AndrewBastin on GitHub.

Is your feature request related to a problem? Please describe.

GraphQL view does not have any syntax highlighting on queries

Describe the solution you'd like

Something like GraphiQL or other editors have

Describe alternatives you've considered

Considering Postwoman already uses graphql-language-service-interface, maybe it's possible to extract tokens from there.

Originally created by @danilofuchs on GitHub (Apr 5, 2020). Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/741 Originally assigned to: @AndrewBastin on GitHub. **Is your feature request related to a problem? Please describe.** GraphQL view does not have any syntax highlighting on queries ![image](https://user-images.githubusercontent.com/17657014/78503032-8f0ca300-773a-11ea-9d0a-cfe0161432a3.png) **Describe the solution you'd like** Something like GraphiQL or other editors have ![image](https://user-images.githubusercontent.com/17657014/78503095-e3b01e00-773a-11ea-9bc6-cbf681b8d39c.png) **Describe alternatives you've considered** Considering Postwoman already uses `graphql-language-service-interface`, maybe it's possible to extract tokens from there.

kerem

2026-03-16 14:15:30 +03:00

closed this issue
added the
feature
label

kerem commented

2026-03-16 14:15:47 +03:00

Author

Owner

@AndrewBastin commented on GitHub (Apr 11, 2020):

Ace Editor (which powers Postwoman's code editors) doesn't come with a graphql query highlighting mode, hence the query editor just used the json mode to get as much similar editor characteristics down as possible.

I am looking into implementing a editor mode for it myself. I am not really familiar with creating the highlight rules, so it will take a bit of time, along with the problem I can't find enough time to allocate to Postwoman these days, so if anyone wants to pursue this as well, feel free to.

Thanks for opening the issue ^_^

@AndrewBastin commented on GitHub (Apr 11, 2020): Ace Editor (which powers Postwoman's code editors) doesn't come with a graphql query highlighting mode, hence the query editor just used the json mode to get as much similar editor characteristics down as possible. I am looking into implementing a editor mode for it myself. I am not really familiar with creating the highlight rules, so it will take a bit of time, along with the problem I can't find enough time to allocate to Postwoman these days, so if anyone wants to pursue this as well, feel free to. Thanks for opening the issue ^_^

kerem commented

2026-03-16 14:15:52 +03:00

Author

Owner

@danilofuchs commented on GitHub (Apr 16, 2020):

Maybe these help:
https://github.com/ajaxorg/ace/blob/master/lib/ace/mode/graphqlschema.js
https://github.com/ajaxorg/ace/blob/master/lib/ace/mode/graphqlschema_highlight_rules.js

@danilofuchs commented on GitHub (Apr 16, 2020): Maybe these help: https://github.com/ajaxorg/ace/blob/master/lib/ace/mode/graphqlschema.js https://github.com/ajaxorg/ace/blob/master/lib/ace/mode/graphqlschema_highlight_rules.js

kerem commented

2026-03-16 14:15:57 +03:00

Author

Owner

@levrik commented on GitHub (Apr 21, 2020):

@AndrewBastin @liyasthomas I just wonder if integrating https://github.com/microsoft/monaco-editor, the editor component that powers VS Code, would be also an idea. Basically replacing ACE everywhere in Postwoman. I think it has by far better support for stuff like GraphQL and in general is probably more modern and flexible. If this sounds interesting to you, I'm also willing to work on a PR and/or do some research on this.

After reading a bit more details about Monaco it seems like it's probably a bit more complicated and heavy-weighted than I've thought. Probably out-of-scope for Postwoman.

@levrik commented on GitHub (Apr 21, 2020): ~@AndrewBastin @liyasthomas I just wonder if integrating https://github.com/microsoft/monaco-editor, the editor component that powers VS Code, would be also an idea. Basically replacing ACE everywhere in Postwoman. I think it has by far better support for stuff like GraphQL and in general is probably more modern and flexible. If this sounds interesting to you, I'm also willing to work on a PR and/or do some research on this.~ After reading a bit more details about Monaco it seems like it's probably a bit more complicated and heavy-weighted than I've thought. Probably out-of-scope for Postwoman.

kerem commented

2026-03-16 14:16:02 +03:00

Author

Owner

@AndrewBastin commented on GitHub (Apr 21, 2020):

@levrik Yes, I have indeed thought about Monaco. We could get it implemented, which is fine, but the problem is that Monaco doesn't work on mobile devices. Which I am not really sure about with going through with.

@AndrewBastin commented on GitHub (Apr 21, 2020): @levrik Yes, I have indeed thought about Monaco. We could get it implemented, which is fine, but the problem is that Monaco doesn't work on mobile devices. Which I am not really sure about with going through with.

kerem referenced this issue

2026-03-17 00:12:56 +03:00

[PR #255] [MERGED] docs: add izerozlu as a contributor #2520