linter fixes (#4595)

* v3.16.0

* rebuild dist

* rework travis early-success trigger

* Linter fixes

.travis.yml

@@ -11,6 +11,15 @@ branches:
   - master
   - /^v\d+\.\d+(\.\d+)?(-\S*)?$/
 install: "npm i && npm update"
+before_install:
+- | # quickly pass if only documentation is being updated
+    if [ "$TRAVIS_PULL_REQUEST" != "false" ]; then
+      TRAVIS_COMMIT_RANGE="FETCH_HEAD...$TRAVIS_BRANCH"
+      git diff --name-only $TRAVIS_COMMIT_RANGE | grep -qvE '(\.md$)|(^(docs|examples))/' || {
+        echo "Only docs were updated, stopping build process."
+        exit
+      }
+    fi
 before_deploy:
   - npm run build
 env:

README.md

@@ -22,7 +22,7 @@ The OpenAPI Specification has undergone 5 revisions since initial creation in 20
 
 Swagger UI Version | Release Date | OpenAPI Spec compatibility | Notes
 ------------------ | ------------ | -------------------------- | -----
-3.15.0 | 2018-05-19 | 2.0, 3.0 | [tag v3.15.0](https://github.com/swagger-api/swagger-ui/tree/v3.15.0)
+3.16.0 | 2018-05-26 | 2.0, 3.0 | [tag v3.16.0](https://github.com/swagger-api/swagger-ui/tree/v3.16.0)
 3.0.21 | 2017-07-26 | 2.0 | [tag v3.0.21](https://github.com/swagger-api/swagger-ui/tree/v3.0.21)
 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)

make-webpack-config.js

@@ -52,6 +52,7 @@ module.exports = function(rules, options) {
     hot: false,
     separateStylesheets: true,
     minimize: false,
+    mangle: false,
     longTermCaching: false,
     sourcemaps: false,
   }, options._special)
@@ -69,6 +70,10 @@ module.exports = function(rules, options) {
 
     plugins.push(
       new UglifyJsPlugin({
+        uglifyOptions: {
+          mangle: specialOptions.mangle,
+          beautify: !specialOptions.mangle,
+        },
         sourceMap: true,
       }),
       new webpack.LoaderOptionsPlugin({

package.json

@@ -1,6 +1,6 @@
 {
   "name": "swagger-ui",
-  "version": "3.15.0",
+  "version": "3.16.0",
   "main": "dist/swagger-ui.js",
   "repository": "git@github.com:swagger-api/swagger-ui.git",
   "contributors": [
@@ -37,7 +37,10 @@
     "e2e-initial-render": "nightwatch test/e2e/scenarios/ --config test/e2e/nightwatch.json --group initial-render",
     "mock-api": "json-server --watch test/e2e/db.json --port 3204",
     "hot-e2e-server": "webpack-dev-server --port 3230 --content-base test/e2e/helpers --host 0.0.0.0 --config webpack-hot-dev-server.config.js --inline --hot --progress",
-    "e2e": "npm-run-all --parallel -r hot-e2e-server mock-api test-e2e"
+    "e2e": "npm-run-all --parallel -r hot-e2e-server mock-api test-e2e",
+    "open-static": "node -e 'require(\"open\")(\"http://localhost:3002\")'",
+    "serve-static": "http-server dist/ -i -a 0.0.0.0 -p 3002",
+    "start": "npm-run-all --parallel serve-static open-static"
   },
   "dependencies": {
     "@braintree/sanitize-url": "^2.0.2",
@@ -84,7 +87,7 @@
     "scroll-to-element": "^2.0.0",
     "serialize-error": "2.0.0",
     "shallowequal": "0.2.2",
-    "swagger-client": "^3.8.4",
+    "swagger-client": "^3.8.5",
     "url-parse": "^1.1.8",
     "whatwg-fetch": "0.11.1",
     "worker-loader": "^0.7.1",

src/core/components/online-validator-badge.jsx

@@ -1,6 +1,9 @@
 import React from "react"
+import URL from "url-parse"
+
 import PropTypes from "prop-types"
 import { sanitizeUrl } from "core/utils"
+import win from "core/window"
 
 export default class OnlineValidatorBadge extends React.Component {
     static propTypes = {
@@ -11,20 +14,28 @@ export default class OnlineValidatorBadge extends React.Component {
 
     constructor(props, context) {
         super(props, context)
-        let { specSelectors, getConfigs } = props
+        let { getConfigs } = props
         let { validatorUrl } = getConfigs()
         this.state = {
-            url: specSelectors.url(),
+            url: this.getDefinitionUrl(),
             validatorUrl: validatorUrl === undefined ? "https://online.swagger.io/validator" : validatorUrl
         }
     }
 
+    getDefinitionUrl = () => {
+      // TODO: test this behavior by stubbing `window.location` in an Enzyme/JSDom env
+      let { specSelectors } = this.props
+
+      const urlObject = new URL(specSelectors.url(), win.location)
+      return urlObject.toString()
+    }
+
     componentWillReceiveProps(nextProps) {
-        let { specSelectors, getConfigs } = nextProps
+        let { getConfigs } = nextProps
         let { validatorUrl } = getConfigs()
 
         this.setState({
-            url: specSelectors.url(),
+            url: this.getDefinitionUrl(),
             validatorUrl: validatorUrl === undefined ? "https://online.swagger.io/validator" : validatorUrl
         })
     }

src/core/components/param-body.jsx

@@ -47,7 +47,7 @@ export default class ParamBody extends PureComponent {
 
   updateValues = (props) => {
     let { specSelectors, pathMethod, param, isExecute, consumesValue="" } = props
-    let parameter = specSelectors ? specSelectors.parameterWithMeta(pathMethod, param.get("name"), param.get("in")) : fromJS({})
+    let parameter = (specSelectors ? specSelectors.parameterWithMeta(pathMethod, param.get("name"), param.get("in")) : fromJS({})) || param
     let isXml = /xml/i.test(consumesValue)
     let isJson = /json/i.test(consumesValue)
     let paramValue = isXml ? parameter.get("value_xml") : parameter.get("value")

src/core/components/parameter-row.jsx

@@ -30,7 +30,7 @@ export default class ParameterRow extends Component {
     let { isOAS3 } = specSelectors
 
     let example = param.get("example")
-    let parameter = specSelectors.parameterWithMeta(pathMethod, param.get("name"), param.get("in"))
+    let parameter = specSelectors.parameterWithMeta(pathMethod, param.get("name"), param.get("in")) || param
     let enumValue
 
     if(isOAS3()) {
@@ -156,7 +156,7 @@ export default class ParameterRow extends Component {
     }
 
     return (
-      <tr>
+      <tr className="parameters">
         <td className="col parameters-col_name">
           <div className={required ? "parameter__name required" : "parameter__name"}>
             { param.get("name") }

src/core/json-schema-components.js

@@ -17,6 +17,7 @@ const JsonSchemaPropShape = {
   schema: PropTypes.object,
   errors: ImPropTypes.list,
   required: PropTypes.bool,
+  dispatchInitialValue: PropTypes.bool,
   description: PropTypes.any
 }
 
@@ -34,6 +35,13 @@ export class JsonSchemaForm extends Component {
   static propTypes = JsonSchemaPropShape
   static defaultProps = JsonSchemaDefaultProps
 
+  componentDidMount() {
+    const { dispatchInitialValue, value, onChange } = this.props
+    if(dispatchInitialValue) {
+      onChange(value)
+    }
+  }
+
   render() {
     let { schema, errors, value, onChange, getComponent, fn } = this.props
 

src/core/plugins/oas3/components/request-body.jsx

@@ -1,10 +1,12 @@
 import React from "react"
 import PropTypes from "prop-types"
 import ImPropTypes from "react-immutable-proptypes"
-import { OrderedMap } from "immutable"
+import { getSampleSchema } from "core/utils"
+import { Map, OrderedMap } from "immutable"
 
 const RequestBody = ({
   requestBody,
+  requestBodyValue,
   getComponent,
   getConfigs,
   specSelectors,
@@ -13,6 +15,10 @@ const RequestBody = ({
   specPath,
   onChange
 }) => {
+  const handleFile = (e) => {
+    onChange(e.target.files[0])
+  }
+
   const Markdown = getComponent("Markdown")
   const ModelExample = getComponent("modelExample")
   const RequestBodyEditor = getComponent("RequestBodyEditor")
@@ -23,10 +29,80 @@ const RequestBody = ({
 
   const mediaTypeValue = requestBodyContent.get(contentType)
 
+  const isObjectContent = mediaTypeValue.getIn(["schema", "type"]) === "object"
+
   if(!mediaTypeValue) {
     return null
   }
 
+  if(contentType === "application/octet-stream") {
+    const Input = getComponent("Input")
+
+    if(!isExecute) {
+      return <i>
+        Example values are not available for <code>application/octet-stream</code> media types.
+      </i>
+    }
+
+    return <Input type={"file"} onChange={handleFile} />
+  }
+
+  if(
+    isObjectContent &&
+    (contentType === "application/x-www-form-urlencoded"
+    || contentType.indexOf("multipart/") === 0))
+  {
+    const JsonSchemaForm = getComponent("JsonSchemaForm")
+    const HighlightCode = getComponent("highlightCode")
+    const bodyProperties = requestBody.getIn(["content", contentType, "schema", "properties"], OrderedMap())
+    requestBodyValue = Map.isMap(requestBodyValue) ? requestBodyValue : OrderedMap()
+
+    return <div className="table-container">
+      <table>
+        <tbody>
+          {
+            bodyProperties.map((prop, key) => {
+              const required = prop.get("required")
+              const type = prop.get("type")
+              const format = prop.get("format")
+
+              const isFile = type === "string" && (format === "binary" || format === "base64")
+
+              return <tr key={key} className="parameters">
+                <td className="col parameters-col_name">
+                        <div className={required ? "parameter__name required" : "parameter__name"}>
+                          { key }
+                          { !required ? null : <span style={{color: "red"}}>&nbsp;*</span> }
+                        </div>
+                        <div className="parameter__type">
+                          { type }
+                          { format && <span className="prop-format">(${format})</span>}
+                        </div>
+                        <div className="parameter__deprecated">
+                          { prop.get("deprecated") ? "deprecated": null }
+                        </div>
+                      </td>
+                      <td className="col parameters-col_description">
+                        {isExecute ?
+                        <JsonSchemaForm
+                          dispatchInitialValue={!isFile}
+                          schema={prop}
+                          getComponent={getComponent}
+                          value={requestBodyValue.get(key) || getSampleSchema(prop)}
+                          onChange={(value) => {
+                            onChange(value, [key])
+                          }}
+                          />
+                        : <HighlightCode className="example" value={ getSampleSchema(prop) } />}
+                      </td>
+                      </tr>
+            })
+          }
+        </tbody>
+      </table>
+    </div>
+  }
+
   return <div>
     { requestBodyDescription &&
       <Markdown source={requestBodyDescription} />
@@ -53,6 +129,7 @@ const RequestBody = ({
 
 RequestBody.propTypes = {
   requestBody: ImPropTypes.orderedMap.isRequired,
+  requestBodyValue: ImPropTypes.orderedMap.isRequired,
   getComponent: PropTypes.func.isRequired,
   getConfigs: PropTypes.func.isRequired,
   specSelectors: PropTypes.object.isRequired,

src/core/plugins/oas3/wrap-components/index.js

@@ -4,11 +4,13 @@ import parameters from "./parameters"
 import VersionStamp from "./version-stamp"
 import OnlineValidatorBadge from "./online-validator-badge"
 import Model from "./model"
+import JsonSchema_string from "./json-schema-string"
 
 export default {
   Markdown,
   AuthItem,
   parameters,
+  JsonSchema_string,
   VersionStamp,
   model: Model,
   onlineValidatorBadge: OnlineValidatorBadge,

src/core/plugins/oas3/wrap-components/json-schema-string.js

@@ -0,0 +1,26 @@
+import React from "react"
+import { OAS3ComponentWrapFactory } from "../helpers"
+
+export default OAS3ComponentWrapFactory(({ Ori, ...props }) => {
+  const {
+    schema,
+    getComponent,
+    errors,
+    onChange
+  } = props
+
+  const { type, format } = schema
+  const Input = getComponent("Input")
+
+  if(type === "string" && (format === "binary" || format === "base64")) {
+    return <Input type="file"
+                   className={ errors.length ? "invalid" : ""}
+                   title={ errors.length ? errors : ""}
+                   onChange={(e) => {
+                     onChange(e.target.files[0])
+                   }}
+                   disabled={Ori.isDisabled}/>
+  } else {
+    return <Ori {...props} />
+  }
+})

src/core/plugins/oas3/wrap-components/parameters.jsx

@@ -185,8 +185,17 @@ class Parameters extends Component {
               <RequestBody
                 specPath={requestBodySpecPath}
                 requestBody={requestBody}
+                requestBodyValue={oas3Selectors.requestBodyValue(...pathMethod) || Map()}
                 isExecute={isExecute}
-                onChange={(value) => {
+                onChange={(value, path) => {
+                  if(path) {
+                    const lastValue = oas3Selectors.requestBodyValue(...pathMethod)
+                    const usableValue = Map.isMap(lastValue) ? lastValue : Map()
+                    return oas3Actions.setRequestBodyValue({
+                      pathMethod,
+                      value: usableValue.setIn(path, value)
+                    })
+                  }
                   oas3Actions.setRequestBodyValue({ value, pathMethod })
                 }}
                 contentType={oas3Selectors.requestContentType(...pathMethod)}/>

src/core/plugins/spec/actions.js

@@ -348,7 +348,9 @@ export const executeRequest = (req) =>
 
       if(isJSONObject(requestBody)) {
         req.requestBody = JSON.parse(requestBody)
-      } else {
+      } else if(requestBody && requestBody.toJS) {
+        req.requestBody = requestBody.toJS()
+      } else{
         req.requestBody = requestBody
       }
     }

webpack-dist-bundle.config.js

@@ -20,6 +20,7 @@ module.exports = require("./make-webpack-config.js")(rules, {
   _special: {
     separateStylesheets: true,
     minimize: true,
+    mangle: true,
     sourcemaps: true,
   },
 

webpack-dist-standalone.config.js

@@ -20,6 +20,7 @@ module.exports = require("./make-webpack-config.js")(rules, {
   _special: {
     separateStylesheets: true,
     minimize: true,
+    mangle: true,
     sourcemaps: true,
   },