sky-uk/api-explorer

API Explorer is a live documentation client for Swagger/OpenAPI Specification

api-explorer's Issues

Remove the "1 API" counter when we only have 1 API

Allow TabWidget plugin to have own state

A TabWidget plugin need to have a way to define a reducer to store/manage it's own state.

Keep the last response for an operation in the state

This will allow us to, for instance, present detailed information in other operation tab.

Allow .configPlugins() to be optional

This method creates the APIExplorer.plugins prop. If we miss this .configPlugins() call the prop is undefined.

Set default value in APIExplorer constructor or elsewhere. ;-)

mocha test conflict with css import

We have a error in mocha when we import a css in component.

We should find a way to prevent this

Add Extensibility point for the swagger spec

It would be nice to have something that could elegantly change the spec.

e.g. Change the path of the 'host' and 'basepath' to a custom one

Allow TabWidget plugin to have own state

A TabWidget plugin need to have a way to define a reducer to store/manage it's own state.

Improvements

• Add default accepts to the Executer
• Preserve the original query string in all the requests
• Add color change according to the result of the request
• Add request and response headers to the Try out view

Swagger Spec in the url

The idea is to load a diferent spec. We can use a url in the query string or a settings page to add new apis to the current app (of course this will not be persisted in any way)

In a first phase we could make only the query string aproach

Add operation filter to LateralMenu

decorate editor plugin

Export api-explorer as NPM package

We need to export api-explorer as NPM package to became usable by other teams.

Deploy sample api-explorer version to heroku

Create a way to deploy api-explorer to heroku. Options:

a. Build server (CircleCI) step to deploy the master branch of api-explorer to herouku
b. GitHub hook

http://apiexplorer-app.herokuapp.com

Save the last N parameter set used in try it out tab

Create initial structure of documentation using gitbook

Use the sample files from redux: https://github.com/reactjs/redux/blob/master/book.json

• book.json descriptor in the homepage
• write documentation in /docs

Also, check https://github.com/reactjs/redux/blob/gh-pages/package.json#L31 on how to integrate in the build (to use github pages).

Documentation will live here: https://sky-uk.github.io/api-explorer

Display annotation for deprecated apis

sample: "/pet/findByTags" in petstore

Cannot execute "GET /store/inventory" in petshop

Fetching a Swagger specification over HTTP is being blocked

Fetching resources, more specifically, swagger specifications over HTTP is causing an error related with Mixed Content rule. This rule states that websites over HTTPS should not request content over an insure protocol such as HTTP, due to the vulnerabilities that such act may led.

Sample error using Pet Store over HTTP:

Mixed Content: The page at 'https://apiexplorer-app.herokuapp.com/?swaggerSpec=http%3A%2F%2Fpetstore.sw…waggerLoader=swagger1API&swaggerUseProxy=true&swaggerLoader=Swagger2Loader' was loaded over HTTPS, but requested an insecure resource 'http://petstore.swagger.io/v2/swagger.json'. This request has been blocked; the content must be served over HTTPS.

Reproducing this error:

• browser: chrome
• swagger spec: http://petstore.swagger.io/v2/swagger.json
• choose swagger spec v2
• uncheck the option use proxy due to CORS, since doing that basically just bypasses this validation.

We should discuss what should be the behaviour of the UI when faced with such scenario.

For requests to spec's being server HTTP, I think the check "use proxy because of CORS" should be checked and grayed out. Since in this case we want always to bypass the validation in the server side, and also make sure the received content is in fact what we expect to receive, i.e, a proper swagger specification.

Improve api info description

We should use a markdown processor to parse apispec.info.description to display in home page.

This information should not be displayed in the other pages (widget). Only the API title should remain visible.

Remove support for url spec in querystring

When passing a swagger specification to the API Explorer the preceding request URI is malformed.

Reproducing this scenario:

• browser: chrome
• swagger spec: petstore
• version: 2
• use proxy: yes

Output URI

https://apiexplorer-app.herokuapp.com/?swaggerSpec=http%3A%2F%2Fpetstore.swagger.io%2Fv2%2Fswagger.json&swaggerLoader%5B%5D=swagger1API&swaggerLoader%5B%5D=Swagger2Loader&swaggerUseProxy%5B%5D=true&swaggerUseProxy%5B%5D=on

As we can see the swaggerSpec parameter contains the encoded URI bellow:

http%3A%2F%2Fpetstore.swagger.io%2Fv2%2Fswagger.json&swaggerLoader%5B%5D=swagger1API&swaggerLoader%5B%5D=Swagger2Loader&swaggerUseProxy%5B%5D=true&swaggerUseProxy%5B%5D=on

If we decode this URI we will get:

http://petstore.swagger.io/v2/swagger.json&swaggerLoader[]=swagger1API&swaggerLoader[]=Swagger2Loader&swaggerUseProxy[]=true&swaggerUseProxy[]=on

The parameters &swaggerUseProxy[]=on and swaggerLoader[]=swagger1API should not being sent, and also the construct above [URI][&param=value&param=value] is invalid according to the URI RFC specification querystring part is not being preceded by an question mark (?).

On the screenshot of the API Explorer README containing the use case GIF, we can see that this bug was already present by then:

Fix tests

Tests are failing because global APIExplorer requirement for plugin reducers.

Add querystring configuration to README

Sample URL:

https://apiexplorer-app.herokuapp.com/?swaggerSpec=http://adeetc.thothapp.com/swagger/docs/v2&swaggerUseProxy=on

Create API to generate links for operations and accept custom parameters

Accept custom parameters in TryItOut tab.

Use the URL parameters ?param-<key1>=<value>&param-<key2>=<value2>

To set the value:

{
  key1: value,
  key2: value2
}

Impementation of the Try Out

Impementation of the Try Out page with all the information that comes from the Swagger Spec

Change APIExplore.config to APIExplorer.configApiSpec

This will better express the intent of this configuration element in the APIExplorer configuration API.

APIExplorer
  .config(c => {
    c.swagger2API('petstore', 'http://localhost:3000/samples/petstore.json', true)
  })

Create a more complex sample (multiple APIs, plugins, etc)

We should create a more complex sample in order to test other functionalities of API explorer.
Petshop should remain a very basic example (hello world style) and this new sample should be richer in features.

Some goals:

• Multiple APIs
• Samples for all plugin types
• Several (advanced) configuration samples

A pre-requirement of this is to get hold of some swagger samples that align with our target license.

Update email settings

@nunoas, some of your commits are from an unrecognised email.

Change the register of samples to a more automatic way

The register of samples is very explicit because we are defining the paths of the where to read the samples from.

We should read the sample directories and, by convention, call the api.js file and register the endpoints of the samples.

recursive(__dirname + '/sampleapp', function (err, files) { var apiFiles = Enumerable.from(files).where(f => f.indexOf('api.js') > 1).toArray() for(i in apiFiles){ console.log(apiFiles[i]) var api = require(apiFiles[i]) api(app,basePath) } })

see server.js

Create a page for application settings

This will be a new page that hold application settings (core, plugins)

Cannot load api explorer in safari

Safari does not have fetch API. We need to add a pollyfil

Allow other projects to depend, and configure, api-explorer

Create a sample project that depends on api-explorer to configure a specific Swagger API.

For example, we can configure a folder (or even a git repository) named petshop-api-explorer

Split the operations ui into components

The idea is to split the Try out, spec and Response Schema into different components, maintaining the current logic.

In the context of this issue we should also give support for the additions of new operations

Slow Schema Widget Page

With some swagger specs (twitter) the load of the Response Schema is very slow

Swagger 1.0 Parser

improve sampleapps structure

Implementation of the Schema Page

Impementation of the Schema page with all the information that comes from the Swagger Spec

Implement The Spec Widget

Impementation of the Spec page with all the information that comes from the Swagger Spec

Update LateralMenu to use React-Dock

https://github.com/alexkuz/react-dock

create npm scripts to run samples

example:

npm run dev:petstore will the petstore sample

Create development proxy for swagger spec calls

Slack integration test

Add reducer support for plugins

Correct an annoying bug with dropdowns

Define the application state structure

Find a way to cache responses

Cache the API responses like the initial swagger spec response.

This should be configurable in a settings page

Add bunyan for client side logging

https://www.npmjs.com/package/bunyan

Response widget is using request format and not response content type

Response widget is using request format and not response content type.

Update webpack version to remove source map warnings

We should be using import for fetching images inside Components

When using images in our components, we should call require to include those images. That will enable Webpack to export them as dependencies automatically, making the code cleaner.

So instead of this:

<img src='data:image/png;base64,iVBOR....' />

We will have something like this:

<img src={ import `${ASSETS_DIR}/my-image.png` />

Add lint to test npm script

With this we guarantee that CI fails if we are not StandardJS compliant.