Giter Club home page Giter Club logo

graphqlviz's Introduction

graphqlviz Build Status

GraphQL Server CLI visualizer. Adapted from original web interface.

CLI

$ npm install -g graphqlviz
GraphQL Server CLI visualizer

Options:
  -t, --theme      path to theme overrides
  --print-theme    prints default theme to stdout
  --verbose        print introspection result
  -a --auth       set Authorization header for graphql server

Usage
  $ graphqlviz [url]
      Renders dot schema from [url] endpoint

Examples
  $ graphqlviz https://localhost:3000 | dot -Tpng -o graph.png
  $ graphqlviz https://localhost:3000 -a "Bearer xxxxx" | dot -Tpng -o graph.png
  $ graphqlviz https://swapi.apis.guru | dot -Tpng | open -f -a Preview
  $ graphqlviz path/to/schema.json | dot -Tpng | open -f -a Preview
  $ graphqlviz path/to/schema.graphql | dot -Tpng | open -f -a Preview
  $ graphqlviz --print-theme > theme.json
  $ graphqlviz https://localhost:3000 -t theme.json | dot -Tpng | open -f -a Preview
  $ graphqlviz schema.json --theme.header.invert=true | dot -Tpng > schema.png

Note that dot is graphviz's tool to produce layered drawings of directed graphs. graphviz is available through most package managers including homebrew and apt-get. Details here: https://www.graphviz.org/download/

Customizing output

You can print default theme with graphqlviz --print-theme > theme.json, then you can modify it, and pass with --theme theme.json argument. All the available colors can be found on the graphviz site.

Windows Users

Windows users looking use the dot command should download & install from the graphviz website and ensure the installation location is on the system PATH. It has been reported that, for at least some windows versions, the msi does not automatically add the installation to the PATH. Alternatively the executables can be invoked directly. The installation location will likely be similar to C:\Program Files (x86)\Graphviz2.38\bin\.

Mac Users

Mac users can install the dot command as part of graphviz (from AT&T and Bell Labs) by running:

brew install graphviz

Team

Adam Stankiewicz Nathan Smith Join
Adam Stankiewicz Nathan Smith Join

graphqlviz's People

Contributors

ajs139 avatar chrismalherbe avatar cunneen avatar erlingbo avatar glavin001 avatar jonmcoe avatar nathanrsmith avatar sheerun avatar tadfisher avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

graphqlviz's Issues

Fails on federated schema types

Our schema relies on some federated types so we have something like this declared in our schema:

extend type User @key(fields: "id") {
  id: ID! @external
}

This is failing in graphqlviz with:

Unknown type "User".
Cannot extend type "User" because it is not defined.
Unknown directive "key".
Unknown directive "external".

handle non-null list types

Currently, any non-null lists ([Customer]!) or lists of non-null types ([Customer!]), or both ([Customer!]!) will show 'null' as type.

Add custom headers

Some servers may need something like a JWT token in the request headers(as in the current project im working on). Would be neat :)

Support multiple schema files

Is it possible to feed multiple schema files (or perhaps a stream/pipe) to graphqlviz for situations where your schema is modularized?

meow dependency has vulnerability

  Low             Prototype Pollution                                           
  Package         yargs-parser                                                  
  Patched in      >=13.1.2 <14.0.0 || >=15.0.1 <16.0.0 || >=18.1.2              
  Dependency of   graphqlviz [dev]                                              
  Path            graphqlviz > meow > yargs-parser                              
  More info       https://npmjs.com/advisories/1500     

Support multiple layouts

Currently there is a single basic layout with a few rendering options. This ticket should make choosing a renderer more modular with the default being the current one.

Union support?

I love the idea of this project!

I played with it a bit on my GraphQL endpoint and it seems it doesn't support union types. Should it (and I'm missing something), or is the support for unions missing?

Show Input types and link to arguments.

This was noticed when creating #11 because mutations typically have more complex input types. However, other elements such as connections and queries can refer to complex input types as well.

“Unknown directive "specifiedBy"”

specifiedBy is a built-in directive in the latest version of GraphQL.

i'm getting this error when trying to run graphqlviz:

ERROR processing input. Use --verbose flag to see output.
Unknown directive "specifiedBy".

Problem with Docker

I'm trying to use docker to generate the files, but it seens meow have some issues by parsing the cmd line arguments.

FROM node:15.1.0-alpine3.10

RUN npm -g install graphqlviz

RUN graphqlviz ausheuashe

That is expected to say that file ausheuashe does not exists, but the help message is shown instead. I can also put anything as argument it will always show the help.

------                                                                                                                                  
 > [stage-1 4/6] RUN graphqlviz ausheuashe:                                                                                             
#8 2.092                                                                                                                                
#8 2.092   GraphQL Server CLI visualizer                                                                                                
#8 2.092                                                                                                                                
#8 2.092   Options:                                                                                                                     
#8 2.092     -t --theme      path to theme overrides
#8 2.092     --print-theme   print default theme to stdout
#8 2.092     -v --verbose    print introspection result
#8 2.092     -a --auth       set Authorization header for graphql server
#8 2.092 
#8 2.092   Usage:
#8 2.092     $ graphqlviz [url]
#8 2.092         Renders dot schema from [url] endpoint
#8 2.092 
#8 2.092   Examples:
#8 2.092     $ graphqlviz https://localhost:3000 | dot -Tpng -o graph.png
#8 2.092     $ graphqlviz https://example.com/graphql -a "Bearer xxxxx" | dot -Tpng -o graph.png
#8 2.092     $ graphqlviz https://swapi.apis.guru | dot -Tpng | open -f -a Preview
#8 2.092     $ graphqlviz path/to/schema.json | dot -Tpng | open -f -a Preview
#8 2.092     $ graphqlviz path/to/schema.graphql | dot -Tpng | open -f -a Preview
#8 2.092     $ graphqlviz --print-theme > theme.json
#8 2.092     $ graphqlviz https://localhost:3000 -t theme.json | dot -Tpng | open -f -a Preview
#8 2.092     $ graphqlviz schema.json --theme.header.invert=true | dot -Tpng > schema.png
#8 2.092 
------

That also happens if I create a bash script and put the graphqlviz command inside.

Handle interface representation differently

It would be nice to visually represent interfaces in a different manner. If you have GraphQL schema with many types implementing the interface, the graph quickly gets out of control with spaghetti arrows all over the place. A nice alternative representation would be to just put interfaces representations off to the side and put something like Type :: Interface in the title of types that implement the interface. No arrows necessary.

Support GraphQL SDL via stdin

Currently, JSON can be piped via stdin if no address/file is specified. After discussion in #21, it was determined that it would be good to support parsing the GraphQL SDL format as well if the --graphql flag is present.

Mutation support

I notice there are no mutations in the visualisation. Is that on purpose?

What is dot?

And how do I get it? Currently I get -bash: dot: command not found

Skip Relay option

First things first: thanks for building this!

My question is: Do you have any plans to support a 'Skip Relay' option - like https://github.com/APIs-guru/graphql-voyager does?

AFAICT it removes the intermediate Connections and Edges from the output graph, making Relay-compatible schemas a lot more readable.

Cheers.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.