From 265bdc07b73156d45ea50086617ccdbe7e3a1071 Mon Sep 17 00:00:00 2001 From: Kyle Hoskins Date: Tue, 26 Jan 2021 11:00:38 -0600 Subject: [PATCH] feat: add tryItOutEnabled configuration (#6865) * feat: add tryItOutEnabled configuration allow users to set tryItOutEnabled: true to display the "Try it out" section by default tryItOutEnabled to take === "true" for the query string value or === true if someone implements query string type parsing in the query --- docker/configurator/variables.js | 4 ++++ docs/usage/configuration.md | 1 + flavors/swagger-ui-react/README.md | 6 +++++ .../swagger-ui-react/{index.js => index.jsx} | 2 ++ src/core/containers/OperationContainer.jsx | 5 ++++- src/core/index.js | 1 + src/core/oauth2-authorize.js | 2 +- .../features/try-it-out-enabled.yaml | 13 +++++++++++ .../tests/features/try-it-out-enabled.js | 22 +++++++++++++++++++ test/unit/docker/translator.js | 4 ++++ 10 files changed, 58 insertions(+), 2 deletions(-) rename flavors/swagger-ui-react/{index.js => index.jsx} (97%) create mode 100644 test/e2e-cypress/static/documents/features/try-it-out-enabled.yaml create mode 100644 test/e2e-cypress/tests/features/try-it-out-enabled.js diff --git a/docker/configurator/variables.js b/docker/configurator/variables.js index d7595236..8f4870eb 100644 --- a/docker/configurator/variables.js +++ b/docker/configurator/variables.js @@ -91,6 +91,10 @@ const standardVariables = { type: "array", name: "supportedSubmitMethods" }, + TRY_IT_OUT_ENABLED: { + type: "boolean", + name: "tryItOutEnabled" + }, VALIDATOR_URL: { type: "string", name: "validatorUrl" diff --git a/docs/usage/configuration.md b/docs/usage/configuration.md index 39047a73..8d3f4591 100644 --- a/docs/usage/configuration.md +++ b/docs/usage/configuration.md @@ -64,6 +64,7 @@ Parameter name | Docker variable | Description `syntaxHighlight` | _Unavailable_ | Set to `false` to deactivate syntax highlighting of payloads and cURL command, can be otherwise an object with the `activate` and `theme` properties. `syntaxHighlight.activate` | _Unavailable_ | `Boolean=true`. Whether syntax highlighting should be activated or not. `syntaxHighlight.theme` | _Unavailable_ | `String=["agate"*, "arta", "monokai", "nord", "obsidian", "tomorrow-night"]`. [Highlight.js](https://highlightjs.org/static/demo/) syntax coloring theme to use. (Only these 6 styles are available.) +`tryItOutEnabled` | `TRY_IT_OUT_ENABLED` | `Boolean=false`. Controls whether the "Try it out" section should be enabled by default. ##### Network diff --git a/flavors/swagger-ui-react/README.md b/flavors/swagger-ui-react/README.md index 1cba34ae..a3df264b 100644 --- a/flavors/swagger-ui-react/README.md +++ b/flavors/swagger-ui-react/README.md @@ -113,6 +113,12 @@ An array of functions that augment and modify Swagger UI's functionality. See Sw ⚠️ This prop is currently only applied once, on mount. Changes to this prop's value will not be propagated to the underlying Swagger UI instance. A future version of this module will remove this limitation, and the change will not be considered a breaking change. +#### `tryItOutEnabled`: PropTypes.bool + +Controls whether the "Try it out" section should start enabled. The default is false. + +⚠️ This prop is currently only applied once, on mount. Changes to this prop's value will not be propagated to the underlying Swagger UI instance. A future version of this module will remove this limitation, and the change will not be considered a breaking change. + ## Limitations * Not all configuration bindings are available. diff --git a/flavors/swagger-ui-react/index.js b/flavors/swagger-ui-react/index.jsx similarity index 97% rename from flavors/swagger-ui-react/index.js rename to flavors/swagger-ui-react/index.jsx index 31f27b8e..10bb7f39 100644 --- a/flavors/swagger-ui-react/index.js +++ b/flavors/swagger-ui-react/index.jsx @@ -23,6 +23,7 @@ export default class SwaggerUI extends React.Component { supportedSubmitMethods: this.props.supportedSubmitMethods, defaultModelExpandDepth: this.props.defaultModelExpandDepth, displayOperationId: this.props.displayOperationId, + tryItOutEnabled: this.props.tryItOutEnabled, showMutatedRequest: typeof this.props.showMutatedRequest === "boolean" ? this.props.showMutatedRequest : true, deepLinking: typeof this.props.deepLinking === "boolean" ? this.props.deepLinking : false, }) @@ -101,6 +102,7 @@ SwaggerUI.propTypes = { defaultModelsExpandDepth: PropTypes.number, presets: PropTypes.arrayOf(PropTypes.func), deepLinking: PropTypes.bool, + tryItOutEnabled: PropTypes.bool } SwaggerUI.defaultProps = { diff --git a/src/core/containers/OperationContainer.jsx b/src/core/containers/OperationContainer.jsx index e5060e93..a3586f90 100644 --- a/src/core/containers/OperationContainer.jsx +++ b/src/core/containers/OperationContainer.jsx @@ -7,8 +7,11 @@ import { Iterable, fromJS, Map } from "immutable" export default class OperationContainer extends PureComponent { constructor(props, context) { super(props, context) + + const { tryItOutEnabled } = props.getConfigs() + this.state = { - tryItOutEnabled: false, + tryItOutEnabled: tryItOutEnabled === true || tryItOutEnabled === "true", executeInProgress: false } } diff --git a/src/core/index.js b/src/core/index.js index 1007d87c..72a32d3f 100644 --- a/src/core/index.js +++ b/src/core/index.js @@ -43,6 +43,7 @@ export default function SwaggerUI(opts) { displayOperationId: false, displayRequestDuration: false, deepLinking: false, + tryItOutEnabled: false, requestInterceptor: (a => a), responseInterceptor: (a => a), showMutatedRequest: true, diff --git a/src/core/oauth2-authorize.js b/src/core/oauth2-authorize.js index e8fcedd6..16a7a13d 100644 --- a/src/core/oauth2-authorize.js +++ b/src/core/oauth2-authorize.js @@ -63,7 +63,7 @@ export default function authorize ( { auth, authActions, errActions, configs, au scopesArray = scopes.toArray() } - if (scopesArray.length > 0) { + if (scopesArray.length > 0) { let scopeSeparator = authConfigs.scopeSeparator || " " query.push("scope=" + encodeURIComponent(scopesArray.join(scopeSeparator))) diff --git a/test/e2e-cypress/static/documents/features/try-it-out-enabled.yaml b/test/e2e-cypress/static/documents/features/try-it-out-enabled.yaml new file mode 100644 index 00000000..6b0bb009 --- /dev/null +++ b/test/e2e-cypress/static/documents/features/try-it-out-enabled.yaml @@ -0,0 +1,13 @@ +openapi: 3.0.2 +info: + title: try it out enabled test + version: 0.0.1 + description: |- + a simple test to ensure tryItOutEnabled=true expands "Try it out" +paths: + /: + get: + summary: an operation + responses: + "200": + description: OK diff --git a/test/e2e-cypress/tests/features/try-it-out-enabled.js b/test/e2e-cypress/tests/features/try-it-out-enabled.js new file mode 100644 index 00000000..bf49e65c --- /dev/null +++ b/test/e2e-cypress/tests/features/try-it-out-enabled.js @@ -0,0 +1,22 @@ +describe("Try it out enabled configuration", () => { + it("should enable the try it out section when true", () => { + + cy + .visit("?tryItOutEnabled=true&url=/documents/features/try-it-out-enabled.yaml") + .get("#operations-default-get_") + .click() + .get(".try-out__btn") + .should("have.text","Cancel") + }) + + it("should disable the try it out section when false", () => { + + cy + .visit("?tryItOutEnabled=false&url=/documents/features/try-it-out-enabled.yaml") + .get("#operations-default-get_") + .click() + .get(".try-out__btn") + .should("have.text","Try it out ") + }) + }) + \ No newline at end of file diff --git a/test/unit/docker/translator.js b/test/unit/docker/translator.js index 33d1a45a..a98988e1 100644 --- a/test/unit/docker/translator.js +++ b/test/unit/docker/translator.js @@ -245,6 +245,7 @@ describe("docker: env translator", function() { OAUTH2_REDIRECT_URL: "http://google.com/", SHOW_MUTATED_REQUEST: "true", SUPPORTED_SUBMIT_METHODS: `["get", "post"]`, + TRY_IT_OUT_ENABLED: "true", VALIDATOR_URL: "http://smartbear.com/" } @@ -270,6 +271,7 @@ describe("docker: env translator", function() { oauth2RedirectUrl: "http://google.com/", showMutatedRequest: true, supportedSubmitMethods: ["get", "post"], + tryItOutEnabled: true, validatorUrl: "http://smartbear.com/",` ).trim()) }) @@ -299,6 +301,7 @@ describe("docker: env translator", function() { OAUTH2_REDIRECT_URL: "http://google.com/", SHOW_MUTATED_REQUEST: "true", SUPPORTED_SUBMIT_METHODS: `["get", "post"]`, + TRY_IT_OUT_ENABLED: "false", VALIDATOR_URL: "http://smartbear.com/" } @@ -331,6 +334,7 @@ describe("docker: env translator", function() { oauth2RedirectUrl: "http://google.com/", showMutatedRequest: true, supportedSubmitMethods: ["get", "post"], + tryItOutEnabled: false, validatorUrl: "http://smartbear.com/",` ).trim()) })