Merge pull request #3043 from shockey/v/3.0.9

v3.0.9

.github/issue_template.md

@@ -0,0 +1,3 @@
+When reporting an issue, please provide the following details:
+- swagger-ui version
+- a swagger file reproducing the issue

.travis.yml

@@ -7,26 +7,44 @@ branches:
   only:
   - master
   - /^v\d+\.\d+(\.\d+)?(-\S*)?$/
-before_deploy: "npm run build-core"
+before_deploy:
+  - npm run build
 env:
   - DOCKER_IMAGE_NAME=swaggerapi/swagger-ui
 deploy:
-  provider: npm
-  email: apiteam@swagger.io
-  skip_cleanup: true
-  api_key:
-    secure: "IJkLaACa+rfERf1O5nwlqOyuo9sbul3FBhBt4Un9P+DvEet3AoDPV9NQVLd8SkmQYKGbGQWF4BIdjrO5nqFD6Te+JTeUX5Uo/DFS/fu9qw1xv0dQpvbJFuoYnnFlbzGTEs4CFa8lbu3ZromFHQGOQxRobjsG1Kf0dWFSSzmND3g="
-  on:
-    tags: true
-    repo: swagger-api/swagger-ui
-    node: '6.9'
+  - provider: npm
+    email: apiteam@swagger.io
+    skip_cleanup: true
+    api_key:
+      secure: "IJkLaACa+rfERf1O5nwlqOyuo9sbul3FBhBt4Un9P+DvEet3AoDPV9NQVLd8SkmQYKGbGQWF4BIdjrO5nqFD6Te+JTeUX5Uo/DFS/fu9qw1xv0dQpvbJFuoYnnFlbzGTEs4CFa8lbu3ZromFHQGOQxRobjsG1Kf0dWFSSzmND3g="
+    on:
+      tags: true
+      repo: swagger-api/swagger-ui
+      node: '6.9'
+  - provider: script
+    skip_cleanup: true
+    script: swagger-ui-dist-package/deploy.sh
+    on:
+      tags: true
+      repo: swagger-api/swagger-ui
+      node: '6.9'
 after_success:
-  - if [ $DOCKER_HUB_USERNAME ]; then 
+  - if [ $DOCKER_HUB_USERNAME ]; then
       docker login --email=$DOCKER_HUB_EMAIL --username=$DOCKER_HUB_USERNAME --password=$DOCKER_HUB_PASSWORD;
-      docker build -t $DOCKER_IMAGE_NAME .;
-      if [ "$TRAVIS_TAG" != "master" && -z "$TRAVIS_TAG"]; then
-        docker tag $DOCKER_IMAGE_NAME $DOCKER_IMAGE_NAME:$TRAVIS_TAG;
-      fi;
 
-      docker push $DOCKER_IMAGE_NAME;
+      if [ ! -z "$TRAVIS_TAG" ]; then
+        DOCKER_IMAGE_TAG=$TRAVIS_TAG;
+      else
+        DOCKER_IMAGE_TAG=unstable;
+      fi;
+      docker build -t $DOCKER_IMAGE_NAME .;
+      if [ ! -z "$TRAVIS_TAG" ]; then
+        docker tag $DOCKER_IMAGE_NAME $DOCKER_IMAGE_NAME:$DOCKER_IMAGE_TAG;
+        docker push $DOCKER_IMAGE_NAME:$DOCKER_IMAGE_TAG;
+        docker tag $DOCKER_IMAGE_NAME $DOCKER_IMAGE_NAME:latest;
+        docker push $DOCKER_IMAGE_NAME:latest;
+      else
+        docker tag $DOCKER_IMAGE_NAME $DOCKER_IMAGE_NAME:$DOCKER_IMAGE_TAG;
+        docker push $DOCKER_IMAGE_NAME:$DOCKER_IMAGE_TAG;
+      fi;
     fi;

Dockerfile

@@ -2,15 +2,27 @@ FROM alpine:3.4
 
 MAINTAINER fehguy
 
+ENV VERSION "v2.2.10"
+ENV FOLDER "swagger-ui-2.2.10"
+ENV API_URL "http://petstore.swagger.io/v2/swagger.json"
+ENV API_KEY "**None**"
+ENV OAUTH_CLIENT_ID "**None**"
+ENV OAUTH_CLIENT_SECRET "**None**"
+ENV OAUTH_REALM "**None**"
+ENV OAUTH_APP_NAME "**None**"
+ENV OAUTH_ADDITIONAL_PARAMS "**None**"
+ENV SWAGGER_JSON "/app/swagger.json"
+ENV PORT 80
+
 RUN apk add --update nginx
 RUN mkdir -p /run/nginx
 
 COPY nginx.conf /etc/nginx/
 
 # copy swagger files to the `/js` folder
-ADD ./public/* /usr/share/nginx/html/
 ADD ./dist/* /usr/share/nginx/html/
+ADD ./docker-run.sh /usr/share/nginx/
 
 EXPOSE 8080
 
-CMD exec nginx -g 'daemon off;'
+CMD ["sh", "/usr/share/nginx/docker-run.sh"]

README.md

@@ -15,7 +15,7 @@ The OpenAPI Specification has undergone 4 revisions since initial creation in 20
 
 Swagger UI Version | Release Date | OpenAPI Spec compatibility | Notes | Status
 ------------------ | ------------ | -------------------------- | ----- | ------
-3.0.4              | 2017-03-19   | 2.0                        | [tag v3.0.4](https://github.com/swagger-api/swagger-ui/tree/v3.0.4) |
+3.0.9              | 2017-03-19   | 2.0                        | [tag v3.0.9](https://github.com/swagger-api/swagger-ui/tree/v3.0.9) |
 2.2.10             | 2017-01-04   | 1.1, 1.2, 2.0              | [tag v2.2.10](https://github.com/swagger-api/swagger-ui/tree/v2.2.10) |
 2.1.5              | 2016-07-20   | 1.1, 1.2, 2.0              | [tag v2.1.5](https://github.com/swagger-api/swagger-ui/tree/v2.1.5) |
 2.0.24             | 2014-09-12   | 1.1, 1.2 | [tag v2.0.24](https://github.com/swagger-api/swagger-ui/tree/v2.0.24) |
@@ -39,7 +39,7 @@ Will start nginx with swagger-ui on port 80.
 - Node 6.x
 - NPM 3.x
 
-If you just want to see your specs, open `public/index.html` in your browser directly from your filesystem.
+If you just want to see your specs, open `dist/index.html` in your browser directly from your filesystem.
 
 If you'd like to make modifications to the codebase, run the dev server with: `npm run dev`.
 
@@ -50,13 +50,71 @@ Swagger UI works in the latest versions of Chrome, Safari, Firefox, Edge and IE1
 
 To help with the migration, here are the currently known issues with 3.X. This list will update regularly, and will not include features that were not implemented in previous versions.
 
-- Currently, the only configuration options available are the `url` and `spec`.
+- Only part of the [parameters](#parameters) previously supported are available.
 - The JSON Form Editor is not implemented.
 - Shebang URL support for operations is missing.
 - Support for `collectionFormat` is partial.
 - l10n (translations) is not implemented.
 - Relative path support for external files is not implemented.
 
+### SwaggerUIBundle
+To use swagger-ui's bundles, you should take a look at the [source of swagger-ui html page](https://github.com/swagger-api/swagger-ui/blob/master/dist/index.html) and customize it. This basically requires you to instantiate a SwaggerUi object as below:
+
+```javascript
+  const ui = SwaggerUIBundle({
+    url: "http://petstore.swagger.io/v2/swagger.json",
+    dom_id: '#swagger-ui',
+    presets: [
+      SwaggerUIBundle.presets.apis,
+      SwaggerUIStandalonePreset
+    ],
+    plugins: [
+      SwaggerUIBundle.plugins.DownloadUrl
+    ],
+    layout: "StandaloneLayout"
+  })
+```
+
+If you'd like to use the bundle files via npm, check out the [`swagger-ui-dist` package](https://www.npmjs.com/package/swagger-ui-dist).
+
+#### Parameters
+
+Parameter Name | Description
+--- | ---
+url | The url pointing to API definition (normally `swagger.json` or `swagger.yaml`).
+spec | A JSON object describing the OpenAPI Specification. When used, the `url` parameter will not be parsed. This is useful for testing manually-generated specifications without hosting them.
+validatorUrl | By default, Swagger-UI attempts to validate specs against swagger.io's online validator. You can use this parameter to set a different validator URL, for example for locally deployed validators ([Validator Badge](https://github.com/swagger-api/validator-badge)). Setting it to `null` will disable validation.
+dom_id | The id of a dom element inside which SwaggerUi will put the user interface for swagger.
+oauth2RedirectUrl | OAuth redirect URL
+operationsSorter | Apply a sort to the operation list of each API. It can be 'alpha' (sort by paths alphanumerically), 'method' (sort by HTTP method) or a function (see Array.prototype.sort() to know how sort function works). Default is the order returned by the server unchanged.
+configUrl | Configs URL
+
+### Plugins
+
+#### Topbar plugin
+Topbar plugin enables top bar with input for spec path and explore button. By default the plugin is enabled, and to disable it you need to remove Topbar plugin from presets in `src/standalone/index.js`:
+
+```
+let preset = [
+  // TopbarPlugin,
+  ConfigsPlugin,
+  () => {
+    return {
+      components: { StandaloneLayout }
+    }
+  }
+]
+```
+
+#### Configs plugin
+Configs plugin allows to fetch external configs instead of passing them to `SwaggerUIBundle`. Fetched configs support two formats: JSON or yaml. The plugin is enabled by default. 
+There are three options of passing config:
+- add a query parameter `config` with URL to a server where the configs are hosted. For ex. http://petstore.swagger.io/?configs=http://localhost:3001/config.yaml
+- add a config `configUrl` with URL to SwaggerUIBundle
+- change default configs in `swagger-config.yaml` *Note: after changing, the project must be re-built*
+
+These options can be used altogether, the order of inheritance is following (from the lowest priority to the highest):
+`swagger-config.yaml` -> config passed to `SwaggerUIBundle` -> config fetched from `configUrl` passed to `SwaggerUIBundle` -> config fetched from URL passed as a query parameter `config`
 
 ## CORS Support
 

composer.json

@@ -0,0 +1,40 @@
+{
+  "name": "swagger-api/swagger-ui",
+  "description": " Swagger UI is a collection of HTML, Javascript, and CSS assets that dynamically generate beautiful documentation from a Swagger-compliant API.",
+  "keywords": [
+    "Swagger",
+    "OpenAPI",
+    "specification",
+    "documentation",
+    "API",
+    "UI"
+  ],
+  "homepage": "http://swagger.io",
+  "license": "Apache-2.0",
+  "authors": [
+    {
+      "name": "Anna Bodnia",
+      "email": "anna.bodnia@gmail.com"
+    },
+    {
+      "name": "Buu Nguyen",
+      "email": "buunguyen@gmail.com"
+    },
+    {
+      "name": "Josh Ponelat",
+      "email": "jponelat@gmail.com"
+    },
+    {
+      "name": "Kyle Shockey",
+      "email": "kyleshockey1@gmail.com"
+    },
+    {
+      "name": "Robert Barnwell",
+      "email": "robert@robertismy.name"
+    },
+    {
+      "name": "Sahar Jafari",
+      "email": "shr.jafari@gmail.com"
+    }    
+  ]
+}

dev-helpers/index.html

@@ -6,8 +6,8 @@
   <title>Swagger UI</title>
   <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700|Source+Code+Pro:300,600|Titillium+Web:400,600,700" rel="stylesheet">
   <link rel="stylesheet" type="text/css" href="./swagger-ui.css" >
-  <link rel="icon" type="image/png" href="../public/favicon-32x32.png" sizes="32x32" />
-  <link rel="icon" type="image/png" href="../public/favicon-16x16.png" sizes="16x16" />
+  <link rel="icon" type="image/png" href="./favicon-32x32.png" sizes="32x32" />
+  <link rel="icon" type="image/png" href="./favicon-16x16.png" sizes="16x16" />
   <style>
     html
     {

dev-helpers/oauth2-redirect.html

@@ -8,11 +8,13 @@
     function run () {
         var oauth2 = window.opener.swaggerUIRedirectOauth2;
         var sentState = oauth2.state;
-        var isValid, qp;
+        var isValid, qp, arr;
 
         qp = (window.location.hash || location.search).substring(1);
 
-        qp = qp ? JSON.parse('{"' + qp.replace(/&/g, '","').replace(/=/g, '":"') + '"}',
+        arr = qp.split("&")
+        arr.forEach(function (v,i,_arr) { _arr[i] = '"' + v.replace('=', '":"') + '"';})
+        qp = qp ? JSON.parse('{' + arr.join() + '}',
                 function (key, value) {
                     return key === "" ? value : decodeURIComponent(value)
                 }
@@ -33,51 +35,19 @@
             if (qp.code) {
                 delete oauth2.state;
                 oauth2.auth.code = qp.code;
-                createForm(oauth2.auth, qp).submit();
+                oauth2.callback(oauth2.auth);
             } else {
                 oauth2.errCb({
                     authId: oauth2.auth.name,
                     source: "auth",
                     level: "error",
-                    message: "Authorization failed: no accessCode came from the server"
+                    message: "Authorization failed: no accessCode received from the server"
                 });
-                window.close();
             }
         } else {
             oauth2.callback({auth: oauth2.auth, token: qp, isValid: isValid});
-            window.close();
         }
-    }
-
-    function createForm(auth, qp) {
-        var form = document.createElement("form");
-        var schema = auth.schema;
-        var action = schema.get("tokenUrl");
-        var name, input;
-
-        var fields = {
-            code: qp.code,
-            "redirect_uri": location.protocol + "//" + location.host + location.pathname,
-            "grant_type": "authorization_code",
-            "client_secret": auth.clientSecret,
-            "client_id": auth.clientId
-        }
-
-        for ( name in fields ) {
-            input = document.createElement("input");
-            input.name = name;
-            input.value = fields[name];
-            input.type = "hidden";
-            form.appendChild(input);
-        }
-
-
-        form.method = "POST";
-        form.action = action;
-
-        document.body.appendChild(form);
-
-        return form;
+        window.close();
     }
 
 </script>

dist/index.html

@@ -6,8 +6,8 @@
   <title>Swagger UI</title>
   <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700|Source+Code+Pro:300,600|Titillium+Web:400,600,700" rel="stylesheet">
   <link rel="stylesheet" type="text/css" href="./swagger-ui.css" >
-  <link rel="icon" type="image/png" href="../public/favicon-32x32.png" sizes="32x32" />
-  <link rel="icon" type="image/png" href="../public/favicon-16x16.png" sizes="16x16" />
+  <link rel="icon" type="image/png" href="./favicon-32x32.png" sizes="32x32" />
+  <link rel="icon" type="image/png" href="./favicon-16x16.png" sizes="16x16" />
   <style>
     html
     {

dist/oauth2-redirect.html

@@ -0,0 +1,53 @@
+<!doctype html>
+<html lang="en-US">
+<body onload="run()">
+</body>
+</html>
+<script>
+    'use strict';
+    function run () {
+        var oauth2 = window.opener.swaggerUIRedirectOauth2;
+        var sentState = oauth2.state;
+        var isValid, qp, arr;
+
+        qp = (window.location.hash || location.search).substring(1);
+
+        arr = qp.split("&")
+        arr.forEach(function (v,i,_arr) { _arr[i] = '"' + v.replace('=', '":"') + '"';})
+        qp = qp ? JSON.parse('{' + arr.join() + '}',
+                function (key, value) {
+                    return key === "" ? value : decodeURIComponent(value)
+                }
+        ) : {}
+
+        isValid = qp.state === sentState
+
+        if (oauth2.auth.schema.get("flow") === "accessCode" && !oauth2.auth.code) {
+            if (!isValid) {
+                oauth2.errCb({
+                    authId: oauth2.auth.name,
+                    source: "auth",
+                    level: "warning",
+                    message: "Authorization may be unsafe, passed state was changed in server Passed state wasn't returned from auth server"
+                });
+            }
+
+            if (qp.code) {
+                delete oauth2.state;
+                oauth2.auth.code = qp.code;
+                oauth2.callback(oauth2.auth);
+            } else {
+                oauth2.errCb({
+                    authId: oauth2.auth.name,
+                    source: "auth",
+                    level: "error",
+                    message: "Authorization failed: no accessCode received from the server"
+                });
+            }
+        } else {
+            oauth2.callback({auth: oauth2.auth, token: qp, isValid: isValid});
+        }
+        window.close();
+    }
+
+</script>

dist/swagger-ui-bundle.js.map

@@ -1 +1 @@
-{"version":3,"file":"swagger-ui-bundle.js","sources":["webpack:///swagger-ui-bundle.js"],"mappings":"AAAA;AAu/FA;AA6+FA;;;;;;;;;;;;;;;;;;;;;;;;;;AAsdA;;;;;;AAoIA;AAk7FA;AAmtCA;;;;;AA0uIA;AAq7IA;AAo7FA;AA0wGA;AAglFA;AA0jFA;AAq9CA;AA6jDA;AAgrCA;AAgtEA;AAgkIA;;;;;;;;;;;;;;AAw4GA;AAyoIA;AAiuJA;AA8kHA;AAonGA;AAukEA;AA02DA;AAyxDA;AAm+BA;;;;;;AAmsEA;AA2zFA;;;;;AA+1CA;AA2qFA;AAo2CA;AAokCA;AAkhDA;AAwvEA;AAs+FA;;;;;;;;;AA+xBA;AA2zIA;AAg4DA;AA0vDA","sourceRoot":""}
+{"version":3,"file":"swagger-ui-bundle.js","sources":["webpack:///swagger-ui-bundle.js"],"mappings":"AAAA;AAu/FA;AA6+FA;;;;;;;;;;;;;;;;;;;;;;;;;;AAoTA;;;;;;AAoIA;AAi7FA;AAmtCA;AAi0IA;AA2pJA;AA+uFA;AA2rGA;AAgiFA;AA0rFA;AAk9CA;AA2hDA;AA4rCA;AAg6EA;;;;;AA4gCA;AA02JA;;;;;;;;;;;;;;AAuyEA;AA4mIA;AAquJA;AAwsHA;AA2mGA;AAiiEA;AAq4DA;AA+2DA;AAmfA;;;;;;AAmrFA;AA62FA;;;;;AAy3CA;AA2qFA;AAw2CA;AAqkCA;AA++CA;AAsiFA;AAk2FA;;;;;;;;;AAm/CA;AA2zIA;AAk4DA;AAolDA","sourceRoot":""}

dist/swagger-ui-standalone-preset.js.map

@@ -1 +1 @@
-{"version":3,"file":"swagger-ui-standalone-preset.js","sources":["webpack:///swagger-ui-standalone-preset.js"],"mappings":"AAAA;;;;;AAqTA;AAyiGA","sourceRoot":""}
+{"version":3,"file":"swagger-ui-standalone-preset.js","sources":["webpack:///swagger-ui-standalone-preset.js"],"mappings":"AAAA;;;;;AA8QA;AAitGA;AA+vFA;;;;;;AA6eA;AAkvFA;AAu+CA;AAo+CA;AAgrCA;AAgyEA","sourceRoot":""}

dist/swagger-ui.js.map

@@ -1 +1 @@
-{"version":3,"file":"swagger-ui.js","sources":["webpack:///swagger-ui.js"],"mappings":"AAAA;AAsoGA;AAy4HA;AA+7FA;AA2mCA;AAw/BA;AA2hCA;AAs5BA","sourceRoot":""}
+{"version":3,"file":"swagger-ui.js","sources":["webpack:///swagger-ui.js"],"mappings":"AAAA;;;;;;AAyxCA;AAoyHA;AAuxHA;AAy4FA;AA2sCA;AAmgCA;AA0iCA;AA64BA","sourceRoot":""}

docker-run.sh

@@ -0,0 +1,48 @@
+#! /bin/sh
+
+set -e
+
+INDEX_FILE=/usr/share/nginx/html/index.html
+
+replace_in_index () {
+  if [ "$1" != "**None**" ]; then
+    sed -i "s|/\*||g" $INDEX_FILE
+    sed -i "s|\*/||g" $INDEX_FILE
+    sed -i "s|$1|$2|g" $INDEX_FILE
+  fi
+}
+
+replace_or_delete_in_index () {
+  if [ -z "$2" ]; then
+    sed -i "/$1/d" $INDEX_FILE
+  else
+    replace_in_index $1 $2
+  fi
+}
+
+replace_in_index myApiKeyXXXX123456789 $API_KEY
+replace_or_delete_in_index your-client-id $OAUTH_CLIENT_ID
+replace_or_delete_in_index your-client-secret-if-required $OAUTH_CLIENT_SECRET
+replace_or_delete_in_index your-realms $OAUTH_REALM
+replace_or_delete_in_index your-app-name $OAUTH_APP_NAME
+if [ "$OAUTH_ADDITIONAL_PARAMS" != "**None**" ]; then
+    replace_in_index "additionalQueryStringParams: {}" "additionalQueryStringParams: {$OAUTH_ADDITIONAL_PARAMS}"
+fi
+
+if [[ -f $SWAGGER_JSON ]]; then
+  sed -i "s|http://petstore.swagger.io/v2/swagger.json|swagger.json|g" $INDEX_FILE
+  sed -i "s|http://example.com/api|swagger.json|g" $INDEX_FILE
+else
+  sed -i "s|http://petstore.swagger.io/v2/swagger.json|$API_URL|g" $INDEX_FILE
+  sed -i "s|http://example.com/api|$API_URL|g" $INDEX_FILE
+fi
+
+if [[ -n "$VALIDATOR_URL" ]]; then
+  sed -i "s|.*validatorUrl:.*$||g" $INDEX_FILE
+  TMP_VU="$VALIDATOR_URL"
+  [[ "$VALIDATOR_URL" != "null" && "$VALIDATOR_URL" != "undefined" ]] && TMP_VU="\"${VALIDATOR_URL}\""
+  sed -i "s|\(url: .*,\)|\1\n    validatorUrl: ${TMP_VU},|g" $INDEX_FILE
+  unset TMP_VU
+fi
+
+exec nginx -g 'daemon off;'

make-webpack-config.js

@@ -4,9 +4,13 @@ var webpack = require('webpack')
 var ExtractTextPlugin = require('extract-text-webpack-plugin')
 var deepExtend = require('deep-extend')
 var autoprefixer = require('autoprefixer')
+const {gitDescribeSync} = require('git-describe');
 
 var loadersByExtension = require('./build-tools/loadersByExtension')
 
+var pkg = require('./package.json')
+const gitInfo = gitDescribeSync(__dirname)
+
 module.exports = function(options) {
 
   // Special options, that have logic in this file
@@ -60,7 +64,13 @@ module.exports = function(options) {
       'process.env': {
         NODE_ENV:  specialOptions.minimize ? JSON.stringify('production') : null,
         WEBPACK_INLINE_STYLES: !Boolean(specialOptions.separateStylesheets)
+
       },
+      'buildInfo': JSON.stringify({
+        PACKAGE_VERSION: (pkg.version),
+        GIT_COMMIT: gitInfo.hash,
+        GIT_DIRTY: gitInfo.dirty
+      })
     }))
 
   var cssLoader = 'css-loader!postcss-loader'

package.json

@@ -1,6 +1,6 @@
 {
   "name": "swagger-ui",
-  "version": "3.0.4",
+  "version": "3.0.9",
   "main": "dist/swagger-ui.js",
   "repository": "git@github.com:swagger-api/swagger-ui.git",
   "contributors": [
@@ -36,11 +36,12 @@
   },
   "dependencies": {
     "babel-polyfill": "^6.23.0",
+    "base64-js": "^1.2.0",
     "brace": "0.7.0",
-    "btoa": "^1.1.2",
     "deep-extend": "0.4.1",
     "expect": "1.20.2",
     "getbase": "^2.8.2",
+    "ieee754": "^1.1.8",
     "immutable": "^3.x.x",
     "js-yaml": "^3.5.5",
     "less": "2.7.1",
@@ -68,7 +69,8 @@
     "reselect": "2.5.3",
     "serialize-error": "2.0.0",
     "shallowequal": "0.2.2",
-    "swagger-client": "^3.0.4",
+    "swagger-client": "^3.0.9",
+    "url-parse": "^1.1.8",
     "whatwg-fetch": "0.11.1",
     "worker-loader": "^0.7.1",
     "xml": "1.0.1",
@@ -93,6 +95,7 @@
     "eslint-plugin-react": "^6.10.3",
     "extract-text-webpack-plugin": "0.8.2",
     "file-loader": "0.8.4",
+    "git-describe": "^4.0.1",
     "html-webpack-plugin": "^2.28.0",
     "imports-loader": "0.6.5",
     "json-loader": "0.5.3",
@@ -112,6 +115,7 @@
     "postcss-loader": "0.7.0",
     "raw-loader": "0.5.1",
     "react-hot-loader": "^1.3.1",
+    "react-test-renderer": "^15.5.4",
     "rimraf": "^2.6.0",
     "sass-loader": "^6.0.2",
     "standard": "^8.6.0",

snapcraft.yaml

@@ -0,0 +1,28 @@
+name: swagger-ui
+version: master
+summary: The World's Most Popular API Framework
+description: |
+  Swagger UI is part of the Swagger project. The Swagger project allows you to
+  produce, visualize and consume your OWN RESTful services. No proxy or 3rd
+  party services required. Do it your own way.
+
+  Swagger UI is a dependency-free collection of HTML, Javascript, and CSS
+  assets that dynamically generate beautiful documentation and sandbox from a
+  Swagger-compliant API. Because Swagger UI has no dependencies, you can host
+  it in any server environment, or on your local machine.
+
+grade: devel
+confinement: strict
+
+apps:
+  swagger-ui:
+    command: sh -c \"cd $SNAP/lib/node_modules/swagger-ui/dist && http-server -a localhost -p 8080\"
+    daemon: simple
+    plugs: [network, network-bind]
+
+parts:
+  swagger-ui:
+    source: .
+    plugin: nodejs
+    npm-run: [build]
+    node-packages: [handlebars, http-server]

src/core/components/auth/api-key-auth.jsx

@@ -64,11 +64,10 @@ export default class ApiKeyAuth extends React.Component {
         </Row>
         <Row>
           <label>Value:</label>
-          <Col>
-            {
-              value || <Input type="text" onChange={ this.onChange }/>
-            }
-          </Col>
+          {
+            value ? <code> ****** </code>
+                  : <Col><Input type="text" onChange={ this.onChange }/></Col>
+          }
         </Row>
         {
           errors.valueSeq().map( (error, key) => {

src/core/components/auth/authorize-operation-btn.jsx

@@ -16,6 +16,10 @@ export default class AuthorizeOperationBtn extends React.Component {
 
     let isAuthorized = authSelectors.isAuthorized(security)
 
+    if(isAuthorized === null) {
+      return null
+    }
+
     return (
       <button className={isAuthorized ? "authorization__btn locked" : "authorization__btn unlocked"} onClick={ this.onClick }>
         <svg width="20" height="20">

src/core/components/auth/basic-auth.jsx

@@ -63,19 +63,23 @@ export default class BasicAuth extends React.Component {
                     source={ schema.get("description") } />
         </Row>
         <Row>
-          <Col tablet={2} desktop={2}>username:</Col>
-          <Col tablet={10} desktop={10}>
+          <label>Username:</label>
+          {
+            username ? <code> { username } </code>
+                     : <Col><Input type="text" required="required" name="username" onChange={ this.onChange }/></Col>
+          }
+        </Row>
+        <Row>
+          <label>Password:</label>
             {
-              username || <Input type="text" required="required" name="username" onChange={ this.onChange }/>
+              username ? <code> ****** </code>
+                       : <Col><Input required="required"
+                                     autoComplete="new-password"
+                                     name="password"
+                                     type="password"
+                                     onChange={ this.onChange }/></Col>
             }
-          </Col>
         </Row>
-        {
-          !username && <Row>
-            <Col tablet={2} desktop={2}>password:</Col>
-            <Col tablet={10} desktop={10}><Input required="required" autoComplete="new-password" name="password" type="password" onChange={ this.onChange }/></Col>
-          </Row>
-        }
         {
           errors.valueSeq().map( (error, key) => {
             return <AuthError error={ error }

src/core/components/auth/oauth2.jsx

@@ -26,7 +26,7 @@ export default class Oauth2 extends React.Component {
     let username = auth && auth.get("username") || ""
     let clientId = auth && auth.get("clientId") || ""
     let clientSecret = auth && auth.get("clientSecret") || ""
-    let passwordType = auth && auth.get("passwordType") || "none"
+    let passwordType = auth && auth.get("passwordType") || "basic"
 
     this.state = {
       name: name,
@@ -108,66 +108,69 @@ export default class Oauth2 extends React.Component {
         <p className="flow">Flow: <code>{ schema.get("flow") }</code></p>
 
         {
-          flow === PASSWORD && ( !isAuthorized || isAuthorized && this.state.username) && <Row>
-            <Col tablet={2} desktop={2}>username:</Col>
-            <Col tablet={10} desktop={10}>
+          flow !== PASSWORD ? null
+            : <Row>
+              <Row>
+                <label htmlFor="oauth_username">username:</label>
+                {
+                  isAuthorized ? <code> { this.state.username } </code>
+                    : <Col tablet={10} desktop={10}>
+                      <input id="oauth_username" type="text" data-name="username" onChange={ this.onInputChange }/>
+                    </Col>
+                }
+              </Row>
               {
-                isAuthorized ? <span>{ this.state.username }</span>
-              : <input type="text" data-name="username" onChange={ this.onInputChange }/>
+
               }
-            </Col>
-          </Row>
+              <Row>
+                <label htmlFor="oauth_password">password:</label>
+                {
+                  isAuthorized ? <code> ****** </code>
+                    : <Col tablet={10} desktop={10}>
+                      <input id="oauth_password" type="password" data-name="password" onChange={ this.onInputChange }/>
+                    </Col>
+                }
+              </Row>
+              <Row>
+                <label htmlFor="password_type">type:</label>
+                {
+                  isAuthorized ? <code> { this.state.passwordType } </code>
+                    : <Col tablet={10} desktop={10}>
+                      <select id="password_type" data-name="passwordType" onChange={ this.onInputChange }>
+                        <option value="basic">Basic auth</option>
+                        <option value="request-body">Request body</option>
+                        <option value="query">Query parameters</option>
+                      </select>
+                    </Col>
+                }
+              </Row>
+            </Row>
         }
-
         {
-          flow === PASSWORD && !isAuthorized && <Row>
-            <Col tablet={2} desktop={2}>password:</Col>
-            <Col tablet={10} desktop={10}>
-              <input type="password" data-name="password" onChange={ this.onInputChange }/>
-            </Col>
-          </Row>
-        }
-
-        {
-          flow === PASSWORD && <Row>
-            <Col tablet={2} desktop={2}>type:</Col>
-            <Col tablet={10} desktop={10}>
-              {
-                isAuthorized ? <span>{ this.state.passwordType }</span>
-                             : <select data-name="passwordType" onChange={ this.onInputChange }>
-                                 <option value="none">None or other</option>
-                                 <option value="basic">Basic auth</option>
-                                 <option value="request">Request body</option>
-                               </select>
-              }
-            </Col>
-          </Row>
-        }
-
-        {
-          ( flow === IMPLICIT || flow === ACCESS_CODE || ( flow === PASSWORD && this.state.passwordType!== "none") ) &&
+          ( flow === APPLICATION || flow === IMPLICIT || flow === ACCESS_CODE || ( flow === PASSWORD && this.state.passwordType!== "basic") ) &&
           ( !isAuthorized || isAuthorized && this.state.clientId) && <Row>
             <label htmlFor="client_id">client_id:</label>
-            <Col tablet={10} desktop={10}>
-              {
-                isAuthorized ? <span>{ this.state.clientId }</span>
-              : <input id="client_id" type="text" required={ flow === PASSWORD } data-name="clientId"
+            {
+              isAuthorized ? <code> ****** </code>
+                           : <Col tablet={10} desktop={10}>
+                               <input id="client_id" type="text" required={ flow === PASSWORD } data-name="clientId"
                                       onChange={ this.onInputChange }/>
-              }
-            </Col>
+                             </Col>
+            }
           </Row>
         }
 
         {
-          ( flow === ACCESS_CODE || ( flow === PASSWORD && this.state.passwordType!== "none") ) && <Row>
+          ( flow === APPLICATION || flow === ACCESS_CODE || ( flow === PASSWORD && this.state.passwordType!== "basic") ) && <Row>
             <label htmlFor="client_secret">client_secret:</label>
-            <Col tablet={10} desktop={10}>
-              {
-                isAuthorized ? <span>{ this.state.clientSecret }</span>
-              : <input id="client_secret" type="text" data-name="clientSecret"
+            {
+              isAuthorized ? <code> ****** </code>
+                           : <Col tablet={10} desktop={10}>
+                               <input id="client_secret" type="text" data-name="clientSecret"
                                       onChange={ this.onInputChange }/>
-              }
-            </Col>
+                             </Col>
+            }
+
           </Row>
         }
 
@@ -179,11 +182,11 @@ export default class Oauth2 extends React.Component {
                 <Row key={ name }>
                   <div className="checkbox">
                     <Input data-value={ name }
-                          id={`${name}-checkbox`}
+                          id={`${name}-checkbox-${this.state.name}`}
                            disabled={ isAuthorized }
                            type="checkbox"
                            onChange={ this.onScopeChange }/>
-                         <label htmlFor={`${name}-checkbox`}>
+                         <label htmlFor={`${name}-checkbox-${this.state.name}`}>
                            <span className="item"></span>
                            <div className="text">
                              <p className="name">{name}</p>
@@ -205,7 +208,7 @@ export default class Oauth2 extends React.Component {
           } )
         }
         <div className="auth-btn-wrapper">
-        { isValid && flow !== APPLICATION &&
+        { isValid &&
           ( isAuthorized ? <Button className="btn modal-btn auth authorize" onClick={ this.logout }>Logout</Button>
         : <Button className="btn modal-btn auth authorize" onClick={ this.authorize }>Authorize</Button>
           )

src/core/components/curl.jsx

@@ -19,7 +19,7 @@ export default class Curl extends React.Component {
       <div>
         <h4>Curl</h4>
         <div className="copy-paste">
-          <textarea onFocus={this.handleFocus} className="curl" style={{ whiteSpace: "normal" }} defaultValue={curl}></textarea>
+          <textarea onFocus={this.handleFocus} className="curl" style={{ whiteSpace: "normal" }} value={curl}></textarea>
         </div>
       </div>
     )

src/core/components/errors.jsx

@@ -68,7 +68,7 @@ const ThrownErrorItem = ( { error, jumpToLine } ) => {
             { error.get("message") }
           </span>
           <div>
-            { errorLine ? <a onClick={jumpToLine.bind(null, errorLine)}>Jump to line { errorLine }</a> : null }
+            { errorLine && jumpToLine ? <a onClick={jumpToLine.bind(null, errorLine)}>Jump to line { errorLine }</a> : null }
           </div>
         </div>
       }
@@ -77,11 +77,23 @@ const ThrownErrorItem = ( { error, jumpToLine } ) => {
   }
 
 const SpecErrorItem = ( { error, jumpToLine } ) => {
+  let locationMessage = null
+
+  if(error.get("path")) {
+    if(List.isList(error.get("path"))) {
+      locationMessage = <small>at { error.get("path").join(".") }</small>
+    } else {
+      locationMessage = <small>at { error.get("path") }</small>
+    }
+  } else if(error.get("line") && !jumpToLine) {
+    locationMessage = <small>on line { error.get("line") }</small>
+  }
+
   return (
     <div className="error-wrapper">
       { !error ? null :
         <div>
-          <h4>{ toTitleCase(error.get("source")) + " " + error.get("level") }{ error.get("path") ? <small> at {List.isList(error.get("path")) ? error.get("path").join(".") : error.get("path")}</small>: null }</h4>
+          <h4>{ toTitleCase(error.get("source")) + " " + error.get("level") }&nbsp;{ locationMessage }</h4>
           <span style={{ whiteSpace: "pre-line"}}>{ error.get("message") }</span>
           <div>
             { jumpToLine ? (
@@ -106,6 +118,10 @@ ThrownErrorItem.propTypes = {
   jumpToLine: PropTypes.func
 }
 
+ThrownErrorItem.defaultProps = {
+  jumpToLine: null
+}
+
 SpecErrorItem.propTypes = {
   error: PropTypes.object.isRequired,
   jumpToLine: PropTypes.func

src/core/components/layout-utils.jsx

@@ -16,7 +16,7 @@ export class Container extends React.Component {
     if(fullscreen)
       return <section {...rest}/>
 
-    let containerClass = "container" + (full ? "-full" : "")
+    let containerClass = "swagger-container" + (full ? "-full" : "")
     return (
       <section {...rest} className={xclass(rest.className, containerClass)}/>
     )
@@ -127,7 +127,7 @@ export const Input = (props) => <input {...props} />
 
 export class Select extends React.Component {
   static propTypes = {
-    allowedValues: PropTypes.object,
+    allowedValues: PropTypes.array,
     value: PropTypes.any,
     onChange: PropTypes.func,
     multiple: PropTypes.bool,

src/core/components/layouts/base.jsx

@@ -0,0 +1,80 @@
+import React, { PropTypes } from "react"
+
+export default class BaseLayout extends React.Component {
+
+  static propTypes = {
+    errSelectors: PropTypes.object.isRequired,
+    errActions: PropTypes.object.isRequired,
+    specActions: PropTypes.object.isRequired,
+    specSelectors: PropTypes.object.isRequired,
+    layoutSelectors: PropTypes.object.isRequired,
+    layoutActions: PropTypes.object.isRequired,
+    getComponent: PropTypes.func.isRequired
+  }
+
+  render() {
+    let { specSelectors, specActions, getComponent } = this.props
+
+    let info = specSelectors.info()
+    let url = specSelectors.url()
+    let basePath = specSelectors.basePath()
+    let host = specSelectors.host()
+    let securityDefinitions = specSelectors.securityDefinitions()
+    let externalDocs = specSelectors.externalDocs()
+    let schemes = specSelectors.schemes()
+
+    let Info = getComponent("info")
+    let Operations = getComponent("operations", true)
+    let Models = getComponent("models", true)
+    let AuthorizeBtn = getComponent("authorizeBtn", true)
+    let Row = getComponent("Row")
+    let Col = getComponent("Col")
+    let Errors = getComponent("errors", true)
+    const Schemes = getComponent("schemes")
+
+    const isSpecEmpty = !specSelectors.specStr()
+
+    if(isSpecEmpty) {
+      return <h4>No spec provided.</h4>
+    }
+
+    return (
+
+      <div className='swagger-ui'>
+          <div>
+            <Errors/>
+            <Row className="information-container">
+              <Col mobile={12}>
+                { info.count() ? (
+                  <Info info={ info } url={ url } host={ host } basePath={ basePath } externalDocs={externalDocs} getComponent={getComponent}/>
+                ) : null }
+              </Col>
+            </Row>
+            { schemes && schemes.size || securityDefinitions ? (
+              <div className="scheme-container">
+                <Col className="schemes wrapper" mobile={12}>
+                  { schemes && schemes.size ? (
+                    <Schemes schemes={ schemes } specActions={ specActions } />
+                  ) : null }
+                  { securityDefinitions ? (
+                    <AuthorizeBtn />
+                  ) : null }
+                </Col>
+              </div>
+            ) : null }
+
+            <Row>
+              <Col mobile={12} desktop={12} >
+                <Operations/>
+              </Col>
+            </Row>
+            <Row>
+              <Col mobile={12} desktop={12} >
+                <Models/>
+              </Col>
+            </Row>
+          </div>
+        </div>
+      )
+  }
+}

src/core/components/model.jsx

@@ -4,6 +4,8 @@ import { List } from "immutable"
 const braceOpen = "{"
 const braceClose = "}"
 
+const propStyle = { color: "#999", fontStyle: "italic" }
+
 const EnumModel = ({ value }) => {
   let collapsedContent = <span>Array [ { value.count() } ]</span>
   return <span className="prop-enum">
@@ -129,7 +131,6 @@ class Primitive extends Component {
     let enumArray = schema.get("enum")
     let properties = schema.filter( ( v, key) => ["enum", "type", "format", "$$ref"].indexOf(key) === -1 )
     let style = required ? { fontWeight: "bold" } : {}
-    let propStyle = { color: "#999", fontStyle: "italic" }
 
     return <span className="prop">
       <span className="prop-type" style={ style }>{ type }</span> { required && <span style={{ color: "red" }}>*</span>}
@@ -167,6 +168,7 @@ class ArrayModel extends Component {
   render(){
     let { required, schema, depth, expandDepth } = this.props
     let items = schema.get("items")
+    let properties = schema.filter( ( v, key) => ["type", "items", "$$ref"].indexOf(key) === -1 )
 
     return <span className="model">
       <span className="model-title">
@@ -176,6 +178,13 @@ class ArrayModel extends Component {
         [
           <span><Model { ...this.props } schema={ items } required={ false }/></span>
         ]
+        {
+          properties.size ? <span>
+              { properties.entrySeq().map( ( [ key, v ] ) => <span key={`${key}-${v}`} style={propStyle}>
+                <br />{ `${key}:`}{ String(v) }</span>)
+              }<br /></span>
+            : null
+        }
       </Collapse>
       { required && <span style={{ color: "red" }}>*</span>}
     </span>

src/core/components/operation.jsx

@@ -202,11 +202,12 @@ export default class Operation extends React.Component {
                 pathMethod={ [path, method] }
               />
 
-              {!tryItOutEnabled || !allowTryItOut ? null : schemes && schemes.size ? <Schemes schemes={ schemes }
-                path={ path }
-                method={ method }
-                specActions={ specActions }/>
-              : null
+              {!tryItOutEnabled || !allowTryItOut ? null : schemes && schemes.size ? <div className="opblock-schemes">
+                    <Schemes schemes={ schemes }
+                             path={ path }
+                             method={ method }
+                             specActions={ specActions }/>
+                  </div> : null
               }
 
             <div className={(!tryItOutEnabled || !response || !allowTryItOut) ? "execute-wrapper" : "btn-group"}>

src/core/components/param-body.jsx

@@ -55,9 +55,10 @@ export default class ParamBody extends Component {
     let isXml = /xml/i.test(consumesValue)
     let paramValue = isXml ? parameter.get("value_xml") : parameter.get("value")
 
-    if ( paramValue ) {
-      this.setState({ value: paramValue })
-      this.onChange(paramValue, {isXml: isXml, isEditBox: isExecute})
+    if ( paramValue !== undefined ) {
+      let val = !paramValue && !isXml ? "{}" : paramValue
+      this.setState({ value: val })
+      this.onChange(val, {isXml: isXml, isEditBox: isExecute})
     } else {
       if (isXml) {
         this.onChange(this.sample("xml"), {isXml: isXml, isEditBox: isExecute})

src/core/components/parameter-row.jsx

@@ -28,11 +28,25 @@ export default class ParameterRow extends Component {
 
   componentWillReceiveProps(props) {
     let { specSelectors, pathMethod, param } = props
+    let example = param.get("example")
     let defaultValue = param.get("default")
     let parameter = specSelectors.getParameter(pathMethod, param.get("name"))
-    let value = parameter ? parameter.get("value") : ""
-    if ( defaultValue !== undefined && value === undefined ) {
-      this.onChangeWrapper(defaultValue)
+    let paramValue = parameter ? parameter.get("value") : undefined
+    let enumValue = parameter ? parameter.get("enum") : undefined
+    let value
+
+    if ( paramValue !== undefined ) {
+      value = paramValue
+    } else if ( example !== undefined ) {
+      value = example
+    } else if ( defaultValue !== undefined) {
+      value = defaultValue
+    } else if ( param.get("required") && enumValue && enumValue.size ) {
+      value = enumValue.first()
+    }
+
+    if ( value !== undefined ) {
+      this.onChangeWrapper(value)
     }
   }
 

src/core/components/response.jsx

@@ -5,9 +5,17 @@ import { getSampleSchema } from "core/utils"
 const getExampleComponent = ( sampleResponse, examples, HighlightCode ) => {
   if ( examples && examples.size ) {
     return examples.entrySeq().map( ([ key, example ]) => {
+      let exampleValue
+      try {
+        exampleValue = example && example.toJS ? example.toJS() : example
+        exampleValue = JSON.stringify(exampleValue)
+      }
+      catch(e) {
+        exampleValue = String(example)
+      }
       return (<div key={ key }>
         <h5>{ key }</h5>
-        <HighlightCode className="example" value={ example } />
+        <HighlightCode className="example" value={ exampleValue } />
       </div>)
     }).toArray()
   }

src/core/components/schemes.jsx

@@ -31,7 +31,7 @@ export default class Schemes extends React.Component {
 
     return (
       <label htmlFor="schemes">
-        <span>Schemes</span>
+        <span className="schemes-title">Schemes</span>
         <select onChange={ this.onChange }>
           { schemes.valueSeq().map(
             ( scheme ) => <option value={ scheme } key={ scheme }>{ scheme }</option>

src/core/curlify.js

@@ -4,7 +4,7 @@ export default function curl( request ){
   let headers = request.get("headers")
   curlified.push( "curl" )
   curlified.push( "-X", request.get("method") )
-  curlified.push( request.get("url") )
+  curlified.push( `"${request.get("url")}"`)
 
   if ( headers && headers.size ) {
     for( let p of request.get("headers").entries() ){

src/core/index.js

@@ -1,19 +1,26 @@
 import deepExtend from "deep-extend"
 
 import System from "core/system"
+import win from "core/window"
 import ApisPreset from "core/presets/apis"
 import * as AllPlugins from "core/plugins/all"
 import { filterConfigs } from "plugins/configs"
 import { parseSeach } from "core/utils"
 
+// eslint-disable-next-line no-undef
+const { GIT_DIRTY, GIT_COMMIT, PACKAGE_VERSION } = buildInfo
+
 module.exports = function SwaggerUI(opts) {
 
+  win.versions = win.versions || {}
+  win.versions.swaggerUi = `${PACKAGE_VERSION}/${GIT_COMMIT || "unknown"}${GIT_DIRTY ? "-dirty" : ""}`
+
   const defaults = {
     // Some general settings, that we floated to the top
     dom_id: null,
     spec: {},
     url: "",
-    layout: "Layout",
+    layout: "BaseLayout",
     validatorUrl: "https://online.swagger.io/validator",
     configs: {
     },
@@ -68,22 +75,24 @@ module.exports = function SwaggerUI(opts) {
   var system = store.getSystem()
   let queryConfig = parseSeach()
 
-  const downloadSpec = () => {
+  const downloadSpec = (fetchedConfig) => {
     if(typeof constructorConfig !== "object") {
       return system
     }
 
     let localConfig = system.specSelectors.getLocalConfig ? system.specSelectors.getLocalConfig() : {}
-    let mergedConfig = deepExtend({}, constructorConfig, localConfig, queryConfig)
+    let mergedConfig = deepExtend({}, constructorConfig, localConfig, fetchedConfig || {}, queryConfig)
     store.setConfigs(filterConfigs(mergedConfig))
 
-    if(!queryConfig.url && typeof mergedConfig.spec === "object" && Object.keys(mergedConfig.spec).length) {
-      system.specActions.updateUrl("")
-      system.specActions.updateLoadingStatus("success")
-      system.specActions.updateSpec(JSON.stringify(mergedConfig.spec))
-    } else if(system.specActions.download && mergedConfig.url) {
-      system.specActions.updateUrl(mergedConfig.url)
-      system.specActions.download(mergedConfig.url)
+    if (fetchedConfig !== null) {
+      if (!queryConfig.url && typeof mergedConfig.spec === "object" && Object.keys(mergedConfig.spec).length) {
+        system.specActions.updateUrl("")
+        system.specActions.updateLoadingStatus("success")
+        system.specActions.updateSpec(JSON.stringify(mergedConfig.spec))
+      } else if (system.specActions.download && mergedConfig.url) {
+        system.specActions.updateUrl(mergedConfig.url)
+        system.specActions.download(mergedConfig.url)
+      }
     }
 
     if(mergedConfig.dom_id) {
@@ -95,7 +104,9 @@ module.exports = function SwaggerUI(opts) {
     return system
   }
 
-  if (!system.specActions.getConfigByUrl || (system.specActions.getConfigByUrl && !system.specActions.getConfigByUrl(downloadSpec))) {
+  let configUrl = queryConfig.config || constructorConfig.configUrl
+
+  if (!configUrl || !system.specActions.getConfigByUrl || system.specActions.getConfigByUrl && !system.specActions.getConfigByUrl(configUrl, downloadSpec)) {
     return downloadSpec()
   }
 

src/core/json-schema-components.js

@@ -150,9 +150,9 @@ export class JsonSchema_array extends Component {
           (errors.length ? <span style={{ color: "red", fortWeight: "bold" }}>{ errors[0] }</span> : null) :
           value.map( (item,i) => {
             let schema = Object.assign({}, itemSchema)
-            let err = errors.filter((err) => err.index === i)
-            if ( err.length ) {
-              schema.errors = [ err[0].error + i ]
+            if ( errors.length ) {
+              let err = errors.filter((err) => err.index === i)
+              if (err.length) schema.errors = [ err[0].error + i ]
             }
           return (
             <div key={i} className="json-schema-form-item">

src/core/oauth2-authorize.js

@@ -1,11 +1,12 @@
 import win from "core/window"
+import { btoa } from "core/utils"
 
 export default function authorize ( auth, authActions, errActions, configs ) {
   let { schema, scopes, name, clientId } = auth
 
   let redirectUrl = configs.oauth2RedirectUrl
   let scopeSeparator = " "
-  let state = name
+  let state = btoa(new Date())
   let flow = schema.get("flow")
   let url
 
@@ -14,6 +15,11 @@ export default function authorize ( auth, authActions, errActions, configs ) {
     return
   }
 
+  if (flow === "application") {
+    authActions.authorizeApplication(auth)
+    return
+  }
+
   // todo move to parser
   if ( !redirectUrl ) {
     errActions.newAuthErr( {
@@ -39,7 +45,7 @@ export default function authorize ( auth, authActions, errActions, configs ) {
   win.swaggerUIRedirectOauth2 = {
     auth: auth,
     state: state,
-    callback: authActions.preAuthorizeOauth2,
+    callback: flow === "implicit" ? authActions.preAuthorizeImplicit : authActions.authorizeAccessCode,
     errCb: errActions.newAuthErr
   }
 

src/core/plugins/auth/actions.js

@@ -1,5 +1,5 @@
 import win from "core/window"
-import btoa from "btoa"
+import { btoa, buildFormData } from "core/utils"
 
 export const SHOW_AUTH_POPUP = "show_popup"
 export const AUTHORIZE = "authorize"
@@ -31,7 +31,7 @@ export function logout(payload) {
   }
 }
 
-export const preAuthorizeOauth2 = (payload) => ( { authActions, errActions } ) => {
+export const preAuthorizeImplicit = (payload) => ( { authActions, errActions } ) => {
   let { auth , token, isValid } = payload
   let { schema, name } = auth
   let flow = schema.get("flow")
@@ -68,29 +68,72 @@ export function authorizeOauth2(payload) {
   }
 }
 
-export const authorizePassword = ( auth ) => ( { fn, authActions, errActions } ) => {
+export const authorizePassword = ( auth ) => ( { authActions } ) => {
   let { schema, name, username, password, passwordType, clientId, clientSecret } = auth
-  let req = {
-    url: schema.get("tokenUrl"),
-    method: "post",
-    headers: {
-      "content-type": "application/x-www-form-urlencoded"
-    },
-    query: {
-      grant_type: "password",
-      username,
-      password,
-      scopes: encodeURIComponent(auth.scopes.join(scopeSeparator))
+  let form = {
+    grant_type: "password",
+    scopes: encodeURIComponent(auth.scopes.join(scopeSeparator))
+  }
+  let query = {}
+  let headers = {}
+
+  if ( passwordType === "basic") {
+    headers.Authorization = "Basic " + btoa(username + ":" + password)
+  } else {
+    Object.assign(form,  {username}, {password})
+    if ( passwordType === "query") {
+      if ( clientId ) { query.client_id = clientId }
+      if ( clientSecret ) { query.client_secret = clientSecret }
+    } else {
+      Object.assign(form, {client_id: clientId}, {client_secret: clientSecret})
     }
   }
 
-  if ( passwordType === "basic") {
-    req.headers.authorization = "Basic " + btoa(clientId + ":" + clientSecret)
-  } else if ( passwordType === "request") {
-    req.query = Object.assign(req.query, { client_id: clientId, client_secret: clientSecret })
+  return authActions.authorizeRequest({ body: buildFormData(form), url: schema.get("tokenUrl"), name, headers, query, auth})
+}
+
+export const authorizeApplication = ( auth ) => ( { authActions } ) => {
+  let { schema, scopes, name, clientId, clientSecret } = auth
+  let form = {
+    grant_type: "client_credentials",
+    client_id: clientId,
+    client_secret: clientSecret,
+    scope: scopes.join(scopeSeparator)
   }
-  return fn.fetch(req)
-    .then(( response ) => {
+
+  return authActions.authorizeRequest({body: buildFormData(form), name, url: schema.get("tokenUrl"), auth })
+}
+
+export const authorizeAccessCode = ( auth ) => ( { authActions } ) => {
+ let { schema, name, clientId, clientSecret } = auth
+ let form = {
+   grant_type: "authorization_code",
+   code: auth.code,
+   client_id: clientId,
+   client_secret: clientSecret
+ }
+
+ return authActions.authorizeRequest({body: buildFormData(form), name, url: schema.get("tokenUrl"), auth})
+
+}
+
+export const authorizeRequest = ( data ) => ( { fn, authActions, errActions } ) => {
+  let { body, query={}, headers={}, name, url, auth } = data
+
+  let _headers = Object.assign({
+    "Accept":"application/json, text/plain, */*",
+    "Access-Control-Allow-Origin": "*",
+    "Content-Type": "application/x-www-form-urlencoded"
+  }, headers)
+
+  fn.fetch({
+    url: url,
+    method: "post",
+    headers: _headers,
+    query: query,
+    body: body
+  })
+    .then(function (response) {
       let token = JSON.parse(response.data)
       let error = token && ( token.error || "" )
       let parseError = token && ( token.parseError || "" )
@@ -115,7 +158,14 @@ export const authorizePassword = ( auth ) => ( { fn, authActions, errActions } )
         return
       }
 
-      authActions.authorizeOauth2({ auth, token })
+      authActions.authorizeOauth2({ auth, token})
     })
-    .catch(err => { errActions.newAuthErr( err ) })
+    .catch(e => {
+      let err = new Error(e)
+      errActions.newAuthErr( {
+        authId: name,
+        level: "error",
+        source: "auth",
+        message: err.message
+      } ) })
 }

src/core/plugins/auth/reducers.js

@@ -1,5 +1,5 @@
 import { fromJS, Map } from "immutable"
-import btoa from "btoa"
+import { btoa } from "core/utils"
 
 import {
   SHOW_AUTH_POPUP,

src/core/plugins/auth/selectors.js

@@ -67,6 +67,10 @@ export const authorized = createSelector(
 export const isAuthorized = ( state, securities ) =>( { authSelectors } ) => {
   let authorized = authSelectors.authorized()
 
+  if(!List.isList(securities)) {
+    return null
+  }
+
   return !!securities.toJS().filter( ( security ) => {
       let isAuthorized = true
 

src/core/plugins/download-url.js

@@ -14,8 +14,9 @@ export default function downloadUrlPlugin (toolbox) {
       fetch({
         url,
         loadSpec: true,
+        credentials: "same-origin",
         headers: {
-          "Accept": "application/json"
+          "Accept": "application/json,*/*"
         }
       }).then(next,next)
 

src/core/plugins/samples/fn.js

@@ -47,7 +47,7 @@ export const sampleFromSchema = (schema, config={}) => {
     let obj = {}
     for (var name in props) {
       if ( !props[name].readOnly || includeReadOnly ) {
-        obj[name] = sampleFromSchema(props[name])
+        obj[name] = sampleFromSchema(props[name], { includeReadOnly: includeReadOnly })
       }
     }
 
@@ -55,7 +55,7 @@ export const sampleFromSchema = (schema, config={}) => {
       obj.additionalProp1 = {}
     } else if ( additionalProperties ) {
       let additionalProps = objectify(additionalProperties)
-      let additionalPropVal = sampleFromSchema(additionalProps)
+      let additionalPropVal = sampleFromSchema(additionalProps, { includeReadOnly: includeReadOnly })
 
       for (let i = 1; i < 4; i++) {
         obj["additionalProp" + i] = additionalPropVal
@@ -65,7 +65,7 @@ export const sampleFromSchema = (schema, config={}) => {
   }
 
   if(type === "array") {
-    return [ sampleFromSchema(items) ]
+    return [ sampleFromSchema(items, { includeReadOnly: includeReadOnly }) ]
   }
 
   if(schema["enum"]) {

src/core/plugins/spec/actions.js

@@ -1,4 +1,5 @@
 import YAML from "js-yaml"
+import parseUrl from "url-parse"
 import serializeError from "serialize-error"
 
 // Actions conform to FSA (flux-standard-actions)
@@ -186,7 +187,11 @@ export const logRequest = (req) => {
 // (For debugging) and ease of testing
 export const executeRequest = (req) => ({fn, specActions, specSelectors}) => {
   let { pathName, method } = req
-  let parsedRequest = Object.assign({ contextUrl: specSelectors.url() }, req)
+
+  // if url is relative, parseUrl makes it absolute by inferring from `window.location`
+  req.contextUrl = parseUrl(specSelectors.url()).toString()
+
+  let parsedRequest = Object.assign({}, req)
   if ( pathName && method ) {
     parsedRequest.operationId = method.toLowerCase() + "-" + pathName
   }

src/core/plugins/spec/reducers.js

@@ -97,7 +97,11 @@ export default {
   },
 
   [UPDATE_OPERATION_VALUE]: (state, { payload: { path, value, key } }) => {
-    return state.setIn(["resolved", "paths", ...path, key], fromJS(value))
+    let operationPath = ["resolved", "paths", ...path]
+    if(!state.getIn(operationPath)) {
+      return state
+    }
+    return state.setIn([...operationPath, key], fromJS(value))
   },
 
   [CLEAR_RESPONSE]: (state, { payload: { path, method } } ) =>{

src/core/plugins/spec/selectors.js

@@ -1,4 +1,5 @@
 import { createSelector } from "reselect"
+import { sorters } from "core/utils"
 import { fromJS, Set, Map, List } from "immutable"
 
 const DEFAULT_TAG = "default"
@@ -198,13 +199,16 @@ export const operationsWithTags = createSelector(
   }
 )
 
-export const taggedOperations = createSelector(
-  state,
-  operationsWithTags,
-  (state, tagMap) => {
-    return tagMap.map((ops, tag) => Map({tagDetails: tagDetails(state, tag), operations: ops}))
-  }
-)
+export const taggedOperations = ( state ) =>( { getConfigs } ) => {
+  let { operationsSorter }= getConfigs()
+
+  return operationsWithTags(state).map((ops, tag) => {
+    let sortFn = typeof operationsSorter === "function" ? operationsSorter
+                                                        : sorters.operationsSorter[operationsSorter]
+    let operations = !sortFn ? ops : ops.sort(sortFn)
+
+    return Map({tagDetails: tagDetails(state, tag), operations: operations})})
+}
 
 export const responses = createSelector(
   state,
@@ -291,7 +295,11 @@ export function operationConsumes(state, pathMethod) {
 }
 
 export const operationScheme = ( state, path, method ) => {
-  return state.getIn(["scheme", path, method]) || state.getIn(["scheme", "_defaultScheme"]) || "http"
+  let url = state.get("url")
+  let matchResult = url.match(/^([a-z][a-z0-9+\-.]*):/)
+  let urlScheme = Array.isArray(matchResult) ? matchResult[1] : null
+
+  return state.getIn(["scheme", path, method]) || state.getIn(["scheme", "_defaultScheme"]) || urlScheme || ""
 }
 
 export const canExecuteScheme = ( state, path, method ) => {

src/core/plugins/view/root-injects.js

@@ -74,7 +74,7 @@ const createClass = component => React.createClass({
 const Fallback = ({ name }) => <div style={{ // eslint-disable-line react/prop-types
     padding: "1em",
     "color": "#aaa"
-  }}>😱 <i>Could not render { name || name === "t" ? name : "this component" }, see the console.</i></div>
+  }}>😱 <i>Could not render { name === "t" ? "this component" : name }, see the console.</i></div>
 
 const wrapRender = (component) => {
   const isStateless = component => !(component.prototype && component.prototype.isReactComponent)

src/core/presets/base.js

@@ -46,6 +46,8 @@ import Model from "core/components/model"
 import Models from "core/components/models"
 import TryItOutButton from "core/components/try-it-out-button"
 
+import BaseLayout from "core/components/layouts/base"
+
 import * as LayoutUtils from "core/components/layout-utils"
 import * as JsonSchemaComponents from "core/json-schema-components"
 
@@ -87,6 +89,7 @@ export default function() {
       model: Model,
       models: Models,
       TryItOutButton,
+      BaseLayout
     }
   }
 

src/core/system.js

@@ -2,7 +2,6 @@ import { createStore, applyMiddleware, bindActionCreators, compose } from "redux
 import Im, { fromJS, Map } from "immutable"
 import deepExtend from "deep-extend"
 import { combineReducers } from "redux-immutable"
-import assign from "object-assign"
 import serializeError from "serialize-error"
 import { NEW_THROWN_ERR } from "corePlugins/err/actions"
 import win from "core/window"
@@ -74,7 +73,7 @@ export default class Store {
     let dispatch = this.getStore().dispatch
     let getState = this.getStore().getState
 
-    this.boundSystem = assign({},
+    this.boundSystem = Object.assign({},
         this.getRootInjects(),
         this.getWrappedAndBoundActions(dispatch),
         this.getBoundSelectors(getState, this.getSystem),
@@ -92,7 +91,7 @@ export default class Store {
   }
 
   getRootInjects() {
-    return assign({
+    return Object.assign({
       getSystem: this.getSystem,
       getStore: this.getStore.bind(this),
       getComponents: this.getComponents.bind(this),
@@ -251,7 +250,7 @@ export default class Store {
 
   getMapStateToProps() {
     return () => {
-      let obj = assign({}, this.getSystem())
+      let obj = Object.assign({}, this.getSystem())
       return obj
     }
   }

src/core/utils.js

@@ -1,5 +1,4 @@
 import Im from "immutable"
-import assign from "object-assign"
 import shallowEqual from "shallowequal"
 
 import camelCase from "lodash/camelCase"
@@ -85,7 +84,7 @@ export function objReduce(obj, fn) {
   return Object.keys(obj).reduce((newObj, key) => {
     let res = fn(obj[key], key)
     if(res && typeof res === "object")
-      assign(newObj, res)
+      Object.assign(newObj, res)
     return newObj
   }, {})
 }
@@ -453,13 +452,13 @@ export const propChecker = (props, nextProps, objectList=[], ignoreList=[]) => {
 }
 
 const validateNumber = ( val ) => {
-  if ( !/^\d+(.?\d+)?$/.test(val)) {
+  if ( !/^-?\d+(.?\d+)?$/.test(val)) {
     return "Value must be a number"
   }
 }
 
 const validateInteger = ( val ) => {
-  if ( !/^\d+$/.test(val)) {
+  if ( !/^-?\d+$/.test(val)) {
     return "Value must be integer"
   }
 }
@@ -547,3 +546,34 @@ export const parseSeach = () => {
 
   return map
 }
+
+export const btoa = (str) => {
+  let buffer
+
+  if (str instanceof Buffer) {
+    buffer = str
+  } else {
+    buffer = new Buffer(str.toString(), "utf-8")
+  }
+
+  return buffer.toString("base64")
+}
+
+export const sorters = {
+  operationsSorter: {
+    alpha: (a, b) => a.get("path").localeCompare(b.get("path")),
+    method: (a, b) => a.get("method").localeCompare(b.get("method"))
+  }
+}
+
+export const buildFormData = (data) => {
+  let formArr = []
+
+  for (let name in data) {
+    let val = data[name]
+    if (val !== undefined && val !== "") {
+      formArr.push([name, "=", encodeURIComponent(val).replace(/%20/g,"+")].join(""))
+    }
+  }
+  return formArr.join("&")
+}

src/plugins/configs/index.js

@@ -1,5 +1,4 @@
 import YAML from "js-yaml"
-import { parseSeach } from "core/utils"
 import yamlConfig from "../../../swagger-config.yaml"
 
 const CONFIGS = [ "url", "spec", "validatorUrl", "onComplete", "onFailure", "authorizations", "docExpansion",
@@ -27,9 +26,7 @@ export default function configPlugin (toolbox) {
             return fetch(url)
         },
 
-        getConfigByUrl: (callback)=> ({ specActions }) => {
-            let config = parseSeach()
-            let configUrl = config.config
+        getConfigByUrl: (configUrl, cb)=> ({ specActions }) => {
             if (configUrl) {
                 return specActions.downloadConfig(configUrl).then(next, next)
             }
@@ -37,9 +34,12 @@ export default function configPlugin (toolbox) {
             function next(res) {
                 if (res instanceof Error || res.status >= 400) {
                     specActions.updateLoadingStatus("failedConfig")
+                    specActions.updateLoadingStatus("failedConfig")
+                    specActions.updateUrl("")
                     console.error(res.statusText + " " + configUrl)
+                    cb(null)
                 } else {
-                    callback(parseYamlConfig(res.text))
+                    cb(parseYamlConfig(res.text))
                 }
             }
         }

src/plugins/topbar/topbar.jsx

@@ -19,9 +19,10 @@ export default class Topbar extends React.Component {
     this.setState({url: value})
   }
 
-  downloadUrl = () => {
+  downloadUrl = (e) => {
     this.props.specActions.updateUrl(this.state.url)
     this.props.specActions.download(this.state.url)
+    e.preventDefault()
   }
 
   render() {
@@ -43,10 +44,10 @@ export default class Topbar extends React.Component {
                 <img height="30" width="30" src={ Logo } alt="Swagger UX"/>
                 <span>swagger</span>
               </Link>
-              <div className="download-url-wrapper">
+              <form className="download-url-wrapper" onSubmit={this.downloadUrl}>
                 <input className="download-url-input" type="text" onChange={ this.onUrlChange } value={this.state.url} disabled={isLoading} style={inputStyle} />
                 <Button className="download-url-button" onClick={ this.downloadUrl }>Explore</Button>
-              </div>
+              </form>
             </div>
           </div>
         </div>

src/standalone/index.js

@@ -2,11 +2,13 @@ import StandaloneLayout from "./layout"
 import "../style/main.scss"
 
 import TopbarPlugin from "plugins/topbar"
+import ConfigsPlugin from "plugins/configs"
 
 // the Standalone preset
 
 let preset = [
   TopbarPlugin,
+  ConfigsPlugin,
   () => {
     return {
       components: { StandaloneLayout }

src/standalone/layout.jsx

@@ -13,28 +13,16 @@ export default class StandaloneLayout extends React.Component {
   }
 
   render() {
-    let { specSelectors, specActions, getComponent } = this.props
+    let { getComponent, specSelectors } = this.props
 
-    let info = specSelectors.info()
-    let url = specSelectors.url()
-    let basePath = specSelectors.basePath()
-    let host = specSelectors.host()
-    let securityDefinitions = specSelectors.securityDefinitions()
-    let externalDocs = specSelectors.externalDocs()
-    let schemes = specSelectors.schemes()
-
-    let Info = getComponent("info")
-    let Operations = getComponent("operations", true)
-    let Models = getComponent("models", true)
-    let AuthorizeBtn = getComponent("authorizeBtn", true)
     let Container = getComponent("Container")
     let Row = getComponent("Row")
     let Col = getComponent("Col")
-    let Errors = getComponent("errors", true)
-    const Schemes = getComponent("schemes")
 
     const Topbar = getComponent("Topbar", true)
+    const BaseLayout = getComponent("BaseLayout", true)
     const OnlineValidatorBadge = getComponent("onlineValidatorBadge", true)
+
     const loadingStatus = specSelectors.loadingStatus()
 
     return (
@@ -56,56 +44,12 @@ export default class StandaloneLayout extends React.Component {
             <h4 className="title">Failed to load config.</h4>
           </div>
         }
-        { loadingStatus === "success" &&
-          <div>
-              <Errors/>
-              <Row className="information-container">
-                <Col mobile={12}>
-                  { info.count() ? (
-                    <Info info={ info } url={ url } host={ host } basePath={ basePath } externalDocs={externalDocs} getComponent={getComponent}/>
-                  ) : null }
-                </Col>
-              </Row>
-              { schemes && schemes.size && securityDefinitions ? (
-              <div className="scheme-container">
-                <Col className="schemes wrapper" mobile={12}>
-                  { schemes && schemes.size ? (
-                    <Schemes schemes={ schemes } specActions={ specActions } />
-                  ) : null }
-                  { securityDefinitions ? (
-                    <AuthorizeBtn />
-                  ) : null }
-                </Col>
-              </div>
-            ) : null }
-
-            { (!schemes || !schemes.size) && securityDefinitions ? (
-              <div className="scheme-container">
-                <Col className="schemes wrapper" mobile={12}>
-                  { securityDefinitions ? (
-                    <AuthorizeBtn />
-                  ) : null }
-                </Col>
-              </div>
-            ) : null }
-
-              <Row>
-                <Col mobile={12} desktop={12} >
-                  <Operations/>
-                </Col>
-              </Row>
-              <Row>
-                <Col mobile={12} desktop={12} >
-                  <Models/>
-                </Col>
-              </Row>
-          </div> }
-
-          <Row>
-            <Col>
-              <OnlineValidatorBadge />
-            </Col>
-          </Row>
+        { !loadingStatus || loadingStatus === "success" && <BaseLayout/> }
+        <Row>
+          <Col>
+            <OnlineValidatorBadge />
+          </Col>
+        </Row>
       </Container>
     )
   }

src/style/_errors.scss

@@ -24,6 +24,11 @@
 
             @include text_code();
         }
+
+        small
+        {
+          color: #666;
+        }
     }
 
     hgroup

src/style/_layout.scss

@@ -307,6 +307,16 @@ body
 
         @include method($_color-disabled);
     }
+
+    .opblock-schemes
+    {
+      padding: 8px 20px;
+
+      .schemes-title
+      {
+        padding: 0 10px 0 0;
+      }
+    }
 }
 
 
@@ -492,6 +502,11 @@ body
     {
         color: #fff !important;
     }
+
+    .headerline
+    {
+        display: block;
+    }
 }
 
 .scheme-container

src/style/_topbar.scss

@@ -16,6 +16,8 @@
 
         display: flex;
 
+        max-width: 300px;
+
         text-decoration: none;
 
         flex: 1;
@@ -33,8 +35,11 @@
     {
         display: flex;
 
+        flex: 3;
+
         input[type=text]
         {
+            width: 100%;
             min-width: 350px;
             margin: 0;
 

swagger-ui-dist-package/.npmignore

@@ -0,0 +1,2 @@
+README.md
+deploy.sh

swagger-ui-dist-package/.npmrc

@@ -0,0 +1 @@
+//registry.npmjs.org/:_authToken=${NPM_TOKEN}

swagger-ui-dist-package/README.md

@@ -0,0 +1,3 @@
+This module, `swagger-ui-dist`, exposes Swagger-UI's entire dist folder as a dependency-free npm module.
+
+Use `swagger-ui` instead, if you'd like to have npm install dependencies for you.

swagger-ui-dist-package/deploy.sh

@@ -0,0 +1,21 @@
+# Deploy `swagger-ui-dist` to npm.
+
+# Parameter Expansion: http://stackoverflow.com/questions/6393551/what-is-the-meaning-of-0-in-a-bash-script
+cd "${0%/*}"
+
+# Get UI version
+UI_VERSION=$(node -p "require('../package.json').version")
+
+# Replace our version placeholder with UI's version
+sed -i "s|\$\$VERSION|$UI_VERSION|g" package.json
+
+# Copy UI's dist files to our directory
+cp ../dist/* .
+
+if [ "$PUBLISH_DIST" = "true" ] || [ "$TRAVIS" = "true" ] ; then
+  npm publish .
+else
+  npm pack .
+fi
+
+find . -not -name .npmignore -not -name .npmrc -not -name deploy.sh -not -name package.json -not -name README.md -not -name *.tgz -delete 

swagger-ui-dist-package/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "swagger-ui-dist",
+  "version": "$$VERSION",
+  "main": "dist/swagger-ui.js",
+  "repository": "git@github.com:swagger-api/swagger-ui.git",
+  "contributors": [
+    "(in alphabetical order)",
+    "Anna Bodnia <anna.bodnia@gmail.com>",
+    "Buu Nguyen <buunguyen@gmail.com>",
+    "Josh Ponelat <jponelat@gmail.com>",
+    "Kyle Shockey <kyleshockey1@gmail.com>",
+    "Robert Barnwell <robert@robertismy.name>",
+    "Sahar Jafari <shr.jafari@gmail.com>"
+  ],
+  "license": "Apache-2.0",
+  "dependencies": {},
+  "devDependencies": {}
+}

test/core/curlify.js

@@ -21,7 +21,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X POST http://example.com -H  \"Accept: application/json\" -H  \"content-type: application/json\" -d {\"id\":0,\"name\":\"doggie\",\"status\":\"available\"}")
+        expect(curlified).toEqual("curl -X POST \"http://example.com\" -H  \"Accept: application/json\" -H  \"content-type: application/json\" -d {\"id\":0,\"name\":\"doggie\",\"status\":\"available\"}")
     })
 
     it("does not change the case of header in curl", function() {
@@ -35,7 +35,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X POST http://example.com -H  \"conTenT Type: application/Moar\"")
+        expect(curlified).toEqual("curl -X POST \"http://example.com\" -H  \"conTenT Type: application/Moar\"")
     })
 
     it("prints a curl statement with an array of query params", function() {
@@ -46,7 +46,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X GET http://swaggerhub.com/v1/one?name=john|smith")
+        expect(curlified).toEqual("curl -X GET \"http://swaggerhub.com/v1/one?name=john|smith\"")
     })
 
     it("prints a curl statement with an array of query params and auth", function() {
@@ -60,7 +60,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X GET http://swaggerhub.com/v1/one?name=john|smith -H  \"authorization: Basic Zm9vOmJhcg==\"")
+        expect(curlified).toEqual("curl -X GET \"http://swaggerhub.com/v1/one?name=john|smith\" -H  \"authorization: Basic Zm9vOmJhcg==\"")
     })
 
     it("prints a curl statement with html", function() {
@@ -77,7 +77,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X GET http://swaggerhub.com/v1/one?name=john|smith -H  \"accept: application/json\" -d {\"description\":\"<b>Test</b>\"}")
+        expect(curlified).toEqual("curl -X GET \"http://swaggerhub.com/v1/one?name=john|smith\" -H  \"accept: application/json\" -d {\"description\":\"<b>Test</b>\"}")
     })
 
     it("handles post body with html", function() {
@@ -94,7 +94,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X POST http://swaggerhub.com/v1/one?name=john|smith -H  \"accept: application/json\" -d {\"description\":\"<b>Test</b>\"}")
+        expect(curlified).toEqual("curl -X POST \"http://swaggerhub.com/v1/one?name=john|smith\" -H  \"accept: application/json\" -d {\"description\":\"<b>Test</b>\"}")
     })
 
     it("handles post body with special chars", function() {
@@ -109,7 +109,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X POST http://swaggerhub.com/v1/one?name=john|smith -d {\"description\":\"@prefix nif:<http://persistence.uni-leipzig.org/nlp2rdf/ontologies/nif-core#> .@prefix itsrdf: <http://www.w3.org/2005/11/its/rdf#> .\"}")
+        expect(curlified).toEqual("curl -X POST \"http://swaggerhub.com/v1/one?name=john|smith\" -d {\"description\":\"@prefix nif:<http://persistence.uni-leipzig.org/nlp2rdf/ontologies/nif-core#> .@prefix itsrdf: <http://www.w3.org/2005/11/its/rdf#> .\"}")
     })
 
     it("handles delete form with parameters", function() {
@@ -123,7 +123,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X DELETE http://example.com -H  \"accept: application/x-www-form-urlencoded\"")
+        expect(curlified).toEqual("curl -X DELETE \"http://example.com\" -H  \"accept: application/x-www-form-urlencoded\"")
     })
 
     it("should print a curl with formData", function() {
@@ -136,7 +136,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X POST http://example.com -H  \"content-type: multipart/form-data\" -F id=123 -F name=Sahar")
+        expect(curlified).toEqual("curl -X POST \"http://example.com\" -H  \"content-type: multipart/form-data\" -F id=123 -F name=Sahar")
     })
 
     it("prints a curl post statement from an object", function() {
@@ -153,7 +153,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X POST http://example.com -H  \"accept: application/json\" -d {\"id\":10101}")
+        expect(curlified).toEqual("curl -X POST \"http://example.com\" -H  \"accept: application/json\" -d {\"id\":10101}")
     })
 
     it("prints a curl post statement from a string containing a single quote", function() {
@@ -168,7 +168,7 @@ describe("curlify", function() {
 
         let curlified = curl(Im.fromJS(req))
 
-        expect(curlified).toEqual("curl -X POST http://example.com -H  \"accept: application/json\" -d \"{\\\"id\\\":\\\"foo'bar\\\"}\"")
+        expect(curlified).toEqual("curl -X POST \"http://example.com\" -H  \"accept: application/json\" -d \"{\\\"id\\\":\\\"foo'bar\\\"}\"")
     })
 
 })

test/core/plugins/spec-reducer.js

@@ -0,0 +1,72 @@
+/* eslint-env mocha */
+import expect from "expect"
+import { fromJS } from "immutable"
+import reducer from "corePlugins/spec/reducers"
+
+describe("spec plugin - reducer", function(){
+
+  describe("update operation value", function() {
+    it("should update the operation at the specified key", () => {
+      const updateOperationValue = reducer["spec_update_operation_value"]
+
+      const state = fromJS({
+        resolved: {
+          "paths": {
+            "/pet": {
+              "post": {
+                "description": "my operation"
+              }
+            }
+          }
+        }
+      })
+
+      let result = updateOperationValue(state, {
+        payload: {
+          path: ["/pet", "post"],
+          value: "application/json",
+          key: "consumes_value"
+        }
+      })
+
+      let expectedResult = {
+        resolved: {
+          "paths": {
+            "/pet": {
+              "post": {
+                "description": "my operation",
+                "consumes_value": "application/json"
+              }
+            }
+          }
+        }
+      }
+
+      expect(result.toJS()).toEqual(expectedResult)
+    })
+
+    it("shouldn't throw an error if we try to update the consumes_value of a null operation", () => {
+      const updateOperationValue = reducer["spec_update_operation_value"]
+
+      const state = fromJS({
+        resolved: {
+          "paths": {
+            "/pet": {
+              "post": null
+            }
+          }
+        }
+      })
+
+      let result = updateOperationValue(state, {
+        payload: {
+          path: ["/pet", "post"],
+          value: "application/json",
+          key: "consumes_value"
+        }
+      })
+
+      expect(result.toJS()).toEqual(state.toJS())
+    })
+  })
+})

test/core/plugins/spec/selectors.js

@@ -1,7 +1,7 @@
 /* eslint-env mocha */
 import expect from "expect"
 import { fromJS } from "immutable"
-import { parameterValues, contentTypeValues } from "corePlugins/spec/selectors"
+import { parameterValues, contentTypeValues, operationScheme } from "corePlugins/spec/selectors"
 
 describe("spec plugin - selectors", function(){
 
@@ -92,4 +92,43 @@ describe("spec plugin - selectors", function(){
 
   })
 
+  describe("operationScheme", function(){
+
+    it("should return the correct scheme for a remote spec that doesn't specify a scheme", function(){
+      // Given
+      let state = fromJS({
+        url: "https://generator.swagger.io/api/swagger.json",
+        resolved: {
+          paths: {
+            "/one": {
+              get: {
+                "consumes_value": "one",
+                "produces_value": "two"
+              }
+            }
+          }
+        }
+      })
+
+      // When
+      let scheme = operationScheme(state, ["/one"], "get")
+      // Then
+      expect(scheme).toEqual("https")
+    })
+
+    // it("should be ok, if no operation found", function(){
+    //   // Given
+    //   let state = fromJS({ })
+    //
+    //   // When
+    //   let contentTypes = contentTypeValues(state, [ "/one", "get" ])
+    //   // Then
+    //   expect(contentTypes.toJS()).toEqual({
+    //     requestContentType: undefined,
+    //     responseContentType: undefined
+    //   })
+    // })
+
+  })
+
 })

webpack-dist.config.js

@@ -22,7 +22,10 @@ module.exports = require('./make-webpack-config.js')({
   },
 
   externals: function(context, request, cb) {
-    if(node_modules.indexOf(request) !== -1) {
+    // webpack injects some stuff into the resulting file,
+    // these libs need to be pulled in to keep that working.
+    var exceptionsForWebpack = ["ieee754", "base64-js"]
+    if(node_modules.indexOf(request) !== -1 || exceptionsForWebpack.indexOf(request) !== -1) {
       cb(null, 'commonjs ' + request)
       return;
     }