Rails Kitchen

It's a place to write on stuff I learned recently.

GraphiQL IDE Alternatives for Development/Testing/Exploring GraphQL Servers

| Comments

GraphiQL is a graphical interactive in-browser GraphQL IDE. This is a great tool for testing GraphQL endpoints and also for Exploring documentation about GraphQL Servers. There are some limitations for default GraphiQL tool, It does not provide any option for saving queries like we have in postman and other API clients. It only saves the latest query in local storage. Another issue with GraphiQL is, it not providing any option for pass headers into GraphQL queries. It is very critical for the testing of application which needs to pass auth-token or some other headers. In this post Iam exploring few alternativs.


GraphQL IDE is n extensive IDE for exploring GraphQL API’s. It allows manage projects, import/export, store queries, toggle query history, passing custom headers and setting environment variables for dynamic headers. Currently, it is only available for MacOS. Window / Linux version of this application is under development but can build the binary. If you have Homebrew installed on OSX, you can install it by:

brew cask install graphql-ide
Execute queries Custom headers Environment variables for dynamic headers Manage projects

GraphiQL.app is light, Electron-based wrapper around GraphiQL. This Provides a tabbed interface for editing and testing GraphQL queries/mutations with GraphiQL. It is only available for MacOS. If you have Homebrew installed on OSX, you can install it by:

brew cask install graphiql

GraphiQL Feen(Chrome Extension)

GraphiQL Feen is a Chrome Extension that allows you to explore and test GraphQL endpoints. It utilizes the Popular GraphiQL component. It

Features are:
Save/Load Queries and variables to build a library of useful queries.
* Save/Select Server Definitions so you can have different settings for different servers.
* GET/POST/Multi-part GraphQL requests supported!
* Authorization defined so cookies forwarded to the domain
* Define Headers that will be sent with the request, Headers can even override existing Request headers:
* Define the Origin: header for CORS requests to allow your server to process correctly.
* Define CSRF token headers
* Override all Cookies so you can pass authentication information with your requests.
* EXPORT your entire application state to a JSON file
* IMPORT saved state so you can restore your state