Merge pull request #3180 from shockey/v/3.0.13

v/3.0.13

README.md

@@ -15,7 +15,8 @@ The OpenAPI Specification has undergone 4 revisions since initial creation in 20
 
 Swagger UI Version | Release Date | OpenAPI Spec compatibility | Notes | Status
 ------------------ | ------------ | -------------------------- | ----- | ------
-3.0.11              | 2017-03-19   | 2.0                        | [tag v3.0.11](https://github.com/swagger-api/swagger-ui/tree/v3.0.11) |
+3.0.13              | 2017-06-02   | 2.0                        | [tag 
+v3.0.13](https://github.com/swagger-api/swagger-ui/tree/v3.0.13) |
 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) |
@@ -41,7 +42,9 @@ Will start nginx with swagger-ui on port 80.
 
 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`.
+If you'd like to make modifications to the codebase, run the dev server with: `npm run dev`. A development server will open on `3200`.
+
+If you'd like to rebuild the `/dist` folder with your codebase changes, run `npm run build`.
 
 ##### Browser support
 Swagger UI works in the latest versions of Chrome, Safari, Firefox, Edge and IE11.
@@ -115,6 +118,8 @@ dom_id | The id of a dom element inside which SwaggerUi will put the user interf
 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
+parameterMacro | MUST be a function. Function to set default value to parameters. Accepts two arguments parameterMacro(operation, parameter). Operation and parameter are objects passed for context, both remain immutable
+modelPropertyMacro | MUST be a function. Function to set default values to each property in model. Accepts one argument modelPropertyMacro(property), property is immutable
 
 ### Plugins
 
@@ -136,7 +141,7 @@ let preset = [
 #### 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 query parameter `config` with URL to a server where the configs are hosted. For ex. http://petstore.swagger.io/?config=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*
 

dev-helpers/index.html

@@ -94,8 +94,8 @@ window.onload = function() {
     clientSecret: "your-client-secret-if-required",
     realm: "your-realms",
     appName: "your-app-name",
-    scopeSeparator: "-",
-    additionalQueryStringParams: {test: "hello"}
+    scopeSeparator: " ",
+    additionalQueryStringParams: {}
   })
 }
 </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;;;;;;;;;;;;;;;;;;;;;;;;;;AAyTA;;;;;;AAoIA;AAi7FA;AAmtCA;AAi0IA;AA0oJA;AAgwFA;AAyrGA;AA4lFA;AAioFA;AA09CA;AAwhDA;AAkrCA;AAu4EA;;;;;AAykCA;AAsyJA;;;;;;;;;;;;;;AA64EA;AA4mIA;AAquJA;AA2qHA;AA2mGA;AAiiEA;AAq4DA;AAg3DA;AAwZA;;;;;;AA8wFA;AAw3FA;;;;;AAkgDA;AAgsFA;AAw2CA;AA2kCA;AA88CA;AAkgFA;AAk2FA;;;;;;;;;AA2pDA;AA2zIA;AAk4DA;AA8mDA","sourceRoot":""}
+{"version":3,"file":"swagger-ui-bundle.js","sources":["webpack:///swagger-ui-bundle.js"],"mappings":"AAAA;AAu/FA;AA6+FA;;;;;;;;;;;;;;;;;;;;;;;;;;AAyTA;;;;;;AAoIA;AAi7FA;AAmtCA;AAi0IA;AA0oJA;AAgwFA;AAyrGA;AA0lFA;AA4nFA;AA+9CA;AA+gDA;AAwrCA;AA60EA;;;;;AA6oCA;AAsyJA;;;;;;;;;;;;;;AA64EA;AA4mIA;AAquJA;AA2qHA;AA2mGA;AAiiEA;AAq4DA;AAg3DA;AAoPA;;;;;;AAk7FA;AA07FA;;;;;AAi8CA;AAgsFA;AAs2CA;AAglCA;AAu9CA;AAy8EA;AAsiCA;AA+yFA;;;;;;;;;AAgkDA;AA2zIA;AAu7FA;AAmrFA;AAu0EA","sourceRoot":""}

dist/swagger-ui.js.map

@@ -1 +1 @@
-{"version":3,"file":"swagger-ui.js","sources":["webpack:///swagger-ui.js"],"mappings":"AAAA;;;;;;AA0yCA;AAoyHA;AA8xHA;AA0kGA;AA+9BA;AA+iCA;AAmjCA;AA25BA","sourceRoot":""}
+{"version":3,"file":"swagger-ui.js","sources":["webpack:///swagger-ui.js"],"mappings":"AAAA;;;;;;AA0yCA;AAoyHA;AAmyHA;AAykGA;AA+9BA;AA6iCA;AAojCA;AAu5BA","sourceRoot":""}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "swagger-ui",
-  "version": "3.0.11",
+  "version": "3.0.13",
   "main": "dist/swagger-ui.js",
   "repository": "git@github.com:swagger-api/swagger-ui.git",
   "contributors": [
@@ -19,7 +19,7 @@
     "build-core": "webpack --config webpack-dist.config.js --colors",
     "build-standalone": "webpack --config webpack-dist-standalone.config.js --colors",
     "predev": "npm install",
-    "dev": "npm-run-all --parallel hot-server watch  open-localhost",
+    "dev": "npm-run-all --parallel hot-server open-localhost",
     "watch": "webpack --config webpack-watch.config.js --watch --progress",
     "open-localhost": "node -e 'require(\"open\")(\"http://localhost:3200\")'",
     "hot-server": "webpack-dev-server --host 0.0.0.0 --config webpack-hot-dev-server.config.js --inline --hot --progress --content-base dev-helpers/",
@@ -67,9 +67,10 @@
     "redux-immutable": "3.0.8",
     "redux-logger": "*",
     "reselect": "2.5.3",
+    "sanitize-html": "^1.14.1",
     "serialize-error": "2.0.0",
     "shallowequal": "0.2.2",
-    "swagger-client": "~3.0.11",
+    "swagger-client": "~3.0.13",
     "url-parse": "^1.1.8",
     "whatwg-fetch": "0.11.1",
     "worker-loader": "^0.7.1",

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

@@ -53,8 +53,7 @@ export default class ApiKeyAuth extends React.Component {
         <h4>Api key authorization<JumpToPath path={[ "securityDefinitions", name ]} /></h4>
         { value && <h6>Authorized</h6>}
         <Row>
-          <Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
-                    source={ schema.get("description") } />
+          <Markdown source={ schema.get("description") } />
         </Row>
         <Row>
           <p>Name: <code>{ schema.get("name") }</code></p>

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

@@ -59,8 +59,7 @@ export default class BasicAuth extends React.Component {
         <h4>Basic authorization<JumpToPath path={[ "securityDefinitions", name ]} /></h4>
         { username && <h6>Authorized</h6> }
         <Row>
-          <Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
-                    source={ schema.get("description") } />
+          <Markdown source={ schema.get("description") } />
         </Row>
         <Row>
           <label>Username:</label>

src/core/components/auth/oauth2.jsx

@@ -102,8 +102,7 @@ export default class Oauth2 extends React.Component {
       <div>
         <h4>OAuth2.0 <JumpToPath path={[ "securityDefinitions", name ]} /></h4>
         { !this.state.appName ? null : <h5>Application: { this.state.appName } </h5> }
-        <Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
-                  source={ schema.get("description") } />
+        <Markdown source={ schema.get("description") } />
 
         { isAuthorized && <h6>Authorized</h6> }
 
@@ -141,8 +140,8 @@ export default class Oauth2 extends React.Component {
                   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="basic">Basic auth</option>
                         <option value="query">Query parameters</option>
                       </select>
                     </Col>

src/core/components/info.jsx

@@ -99,7 +99,7 @@ export default class Info extends React.Component {
         </hgroup>
 
         <div className="description">
-          <Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}} source={ description } />
+          <Markdown source={ description } />
         </div>
 
         {

src/core/components/layout-utils.jsx

@@ -1,13 +1,10 @@
 import React, { PropTypes } from "react"
 import OriCollapse from "react-collapse"
-import _Markdown from "react-remarkable"
 
 function xclass(...args) {
   return args.filter(a => !!a).join(" ").trim()
 }
 
-export const Markdown = _Markdown
-
 export class Container extends React.Component {
   render() {
     let { fullscreen, full, ...rest } = this.props

src/core/components/operation.jsx

@@ -173,7 +173,7 @@ export default class Operation extends React.Component {
               { description &&
                 <div className="opblock-description-wrapper">
                   <div className="opblock-description">
-                    <Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}} source={ description } />
+                    <Markdown source={ description } />
                   </div>
                 </div>
               }

src/core/components/operations.jsx

@@ -48,11 +48,10 @@ export default class Operations extends React.Component {
               return (
                 <div className={showTag ? "opblock-tag-section is-open" : "opblock-tag-section"} key={"operation-" + tag}>
 
-                  <h4 className={!tagDescription ? "opblock-tag no-desc" : "opblock-tag" }>
-                    <span onClick={() => layoutActions.show(isShownKey, !showTag)}>{tag}</span>
-
+                  <h4 onClick={() => layoutActions.show(isShownKey, !showTag)} className={!tagDescription ? "opblock-tag no-desc" : "opblock-tag" }>
+                    <span>{tag}</span>
                     { !tagDescription ? null :
-                        <small onClick={() => layoutActions.show(isShownKey, !showTag)} >
+                        <small>
                           { tagDescription }
                         </small>
                     }

src/core/components/parameter-row.jsx

@@ -99,8 +99,7 @@ export default class ParameterRow extends Component {
         </td>
 
         <td className="col parameters-col_description">
-          <Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
-                    source={ param.get("description") }/>
+          <Markdown source={ param.get("description") }/>
           {(isFormData && !isFormDataSupported) && <div>Error: your browser does not support FormData</div>}
 
           { bodyParam || !isExecute ? null

src/core/components/providers/README.md

@@ -0,0 +1,6 @@
+# Providers
+
+Providers are generic bridges to third-party components. They provide two benefits:
+
+1. ability for plugins to override third-party components, because providers are loaded through `getComponent`
+2. allows us to avoid painting ourselves into a corner with a third-party component

src/core/components/providers/markdown.jsx

@@ -0,0 +1,17 @@
+import React, { PropTypes } from "react"
+import Remarkable from "react-remarkable"
+import sanitize from "sanitize-html"
+
+function Markdown({ source }) {
+  const sanitized = sanitize(source)
+  return <Remarkable
+    options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}}
+    source={sanitized}
+    ></Remarkable>
+}
+
+Markdown.propTypes = {
+  source: PropTypes.string.isRequired
+}
+
+export default Markdown

src/core/components/response.jsx

@@ -76,7 +76,7 @@ export default class Response extends React.Component {
         <td className="col response-col_description">
 
           <div className="response-col_description__inner">
-            <Markdown options={{html: true, typographer: true, linkify: true, linkTarget: "_blank"}} source={ response.get( "description" ) } />
+            <Markdown source={ response.get( "description" ) } />
           </div>
 
           { example ? (

src/core/index.js

@@ -7,8 +7,8 @@ import * as AllPlugins from "core/plugins/all"
 import { parseSeach, filterConfigs } from "core/utils"
 
 const CONFIGS = [ "url", "spec", "validatorUrl", "onComplete", "onFailure", "authorizations", "docExpansion",
-    "apisSorter", "operationsSorter", "supportedSubmitMethods", "highlightSizeThreshold", "dom_id",
-    "defaultModelRendering", "oauth2RedirectUrl", "showRequestHeaders", "custom" ]
+    "apisSorter", "operationsSorter", "supportedSubmitMethods", "dom_id", "defaultModelRendering", "oauth2RedirectUrl",
+    "showRequestHeaders", "custom", "modelPropertyMacro", "parameterMacro" ]
 
 // eslint-disable-next-line no-undef
 const { GIT_DIRTY, GIT_COMMIT, PACKAGE_VERSION } = buildInfo

src/core/plugins/auth/actions.js

@@ -81,7 +81,7 @@ export const authorizePassword = ( auth ) => ( { authActions } ) => {
   if ( passwordType === "basic") {
     headers.Authorization = "Basic " + btoa(username + ":" + password)
   } else {
-    Object.assign(form,  {username}, {password})
+    Object.assign(form, {username}, {password})
 
     if ( passwordType === "query") {
       if ( clientId ) {
@@ -91,7 +91,7 @@ export const authorizePassword = ( auth ) => ( { authActions } ) => {
         query.client_secret = clientSecret
       }
     } else {
-      Object.assign(form, {client_id: clientId}, {client_secret: clientSecret})
+      headers.Authorization = "Basic " + btoa(clientId + ":" + clientSecret)
     }
   }
 
@@ -100,14 +100,15 @@ export const authorizePassword = ( auth ) => ( { authActions } ) => {
 
 export const authorizeApplication = ( auth ) => ( { authActions } ) => {
   let { schema, scopes, name, clientId, clientSecret } = auth
+  let headers = {
+    Authorization: "Basic " + btoa(clientId + ":" + clientSecret)
+  }
   let form = {
     grant_type: "client_credentials",
-    client_id: clientId,
-    client_secret: clientSecret,
     scope: scopes.join(scopeSeparator)
   }
 
-  return authActions.authorizeRequest({body: buildFormData(form), name, url: schema.get("tokenUrl"), auth })
+  return authActions.authorizeRequest({body: buildFormData(form), name, url: schema.get("tokenUrl"), auth, headers })
 }
 
 export const authorizeAccessCode = ( { auth, redirectUrl } ) => ( { authActions } ) => {

src/core/plugins/spec/actions.js

@@ -77,7 +77,9 @@ export const parseToJson = (str) => ({specActions, specSelectors, errActions}) =
   return specActions.updateJsonSpec(json)
 }
 
-export const resolveSpec = (json, url) => ({specActions, specSelectors, errActions, fn: { fetch, resolve, AST }}) => {
+export const resolveSpec = (json, url) => ({specActions, specSelectors, errActions, fn: { fetch, resolve, AST }, getConfigs}) => {
+  const { modelPropertyMacro, parameterMacro } = getConfigs()
+
   if(typeof(json) === "undefined") {
     json = specSelectors.specJson()
   }
@@ -89,7 +91,7 @@ export const resolveSpec = (json, url) => ({specActions, specSelectors, errActio
 
   let specStr = specSelectors.specStr()
 
-  return resolve({fetch, spec: json, baseDoc: url})
+  return resolve({fetch, spec: json, baseDoc: url, modelPropertyMacro, parameterMacro })
   .then( ({spec, errors}) => {
     errActions.clear({
       type: "thrown"

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 Markdown from "core/components/providers/markdown"
+
 import BaseLayout from "core/components/layouts/base"
 
 import * as LayoutUtils from "core/components/layout-utils"
@@ -89,6 +91,7 @@ export default function() {
       model: Model,
       models: Models,
       TryItOutButton,
+      Markdown,
       BaseLayout
     }
   }

src/style/_information.scss

@@ -13,13 +13,18 @@
             font-size: 12px;
         }
     }
-    p
+    p, li, table
     {
         font-size: 14px;
 
         @include text_body();
     }
 
+    h1, h2, h3, h4, h5
+    {
+        @include text_body();
+    }
+
     code
     {
         padding: 3px 5px;

swagger-ui-dist-package/README.md

@@ -1,3 +1,8 @@
-This module, `swagger-ui-dist`, exposes Swagger-UI's entire dist folder as a dependency-free npm module.
+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.
 
-Use `swagger-ui` instead, if you'd like to have npm install dependencies for you.
+`SwaggerUIBundle` and `SwaggerUIStandalonePreset` can be imported:
+```javascript
+  import { SwaggerUIBundle, SwaggerUIStandalonePreset } from 'swagger-ui-dist'
+```
+
+For anything else, check the [Swagger-UI](https://github.com/swagger-api/swagger-ui) repository.

swagger-ui-dist-package/deploy.sh

@@ -18,4 +18,4 @@ 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 
+find . -not -name .npmignore -not -name .npmrc -not -name deploy.sh -not -name index.js -not -name package.json -not -name README.md -not -name *.tgz -delete

swagger-ui-dist-package/index.js

@@ -0,0 +1,2 @@
+module.exports.SwaggerUIBundle = require('./swagger-ui-bundle.js')
+module.exports.SwaggerUIStandalonePreset = require('./swagger-ui-standalone-preset.js')

swagger-ui-dist-package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "swagger-ui-dist",
   "version": "$$VERSION",
-  "main": "dist/swagger-ui.js",
+  "main": "index.js",
   "repository": "git@github.com:swagger-api/swagger-ui.git",
   "contributors": [
     "(in alphabetical order)",

webpack-hot-dev-server.config.js

@@ -10,11 +10,13 @@ module.exports = require("./make-webpack-config")({
 	devtool: "eval",
   entry: {
     'swagger-ui-bundle': [
+      'webpack/hot/dev-server',
       'babel-polyfill',
-      './src/core/index.js'
+      './src/core/index.js',
     ],
     'swagger-ui-standalone-preset': [
-      './src/standalone/index.js'
+      'webpack/hot/dev-server',
+      './src/standalone/index.js',
     ]
   },
   output: {