From 624a81201fa34fbb318f058e800966700238770c Mon Sep 17 00:00:00 2001 From: kyle Date: Fri, 16 Mar 2018 00:08:39 -0700 Subject: [PATCH] feat: `onComplete` config option (#4322) * feat: `onComplete` config option * tests(e2e): add case for onComplete option --- docs/usage/configuration.md | 1 + package.json | 3 +- src/core/plugins/on-complete/index.js | 28 +++++++ src/core/presets/base.js | 4 +- test/e2e/helpers/index.html | 111 ++++++++++++++++++++++++++ test/e2e/scenarios/on-complete.js | 22 +++++ webpack-hot-dev-server.config.js | 1 - 7 files changed, 167 insertions(+), 3 deletions(-) create mode 100644 src/core/plugins/on-complete/index.js create mode 100644 test/e2e/helpers/index.html create mode 100644 test/e2e/scenarios/on-complete.js diff --git a/docs/usage/configuration.md b/docs/usage/configuration.md index 18bad342..de7e9242 100644 --- a/docs/usage/configuration.md +++ b/docs/usage/configuration.md @@ -59,6 +59,7 @@ Parameter Name | Description `operationsSorter` | `Function=(a => a)`. 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. `showExtensions` | `Boolean=false`. Controls the display of vendor extension (`x-`) fields and values for Operations, Parameters, and Schema. `tagsSorter` | `Function=(a => a)`. Apply a sort to the tag list of each API. It can be 'alpha' (sort by paths alphanumerically) or a function (see [Array.prototype.sort()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort) to learn how to write a sort function). Two tag name strings are passed to the sorter for each pass. Default is the order determined by Swagger-UI. +`onComplete` | `Function=NOOP`. Provides a mechanism to be notified when Swagger-UI has finished rendering a newly provided definition. ##### Network diff --git a/package.json b/package.json index 7bb25b61..d3ff2ca6 100644 --- a/package.json +++ b/package.json @@ -37,7 +37,8 @@ "test-e2e": "sleep 3 && nightwatch test/e2e/scenarios/ --config test/e2e/nightwatch.json", "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", - "e2e": "npm-run-all --parallel -r hot-server mock-api test-e2e" + "hot-e2e-server": "webpack-dev-server --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" }, "dependencies": { "@braintree/sanitize-url": "^2.0.2", diff --git a/src/core/plugins/on-complete/index.js b/src/core/plugins/on-complete/index.js new file mode 100644 index 00000000..5eecd4da --- /dev/null +++ b/src/core/plugins/on-complete/index.js @@ -0,0 +1,28 @@ +let engaged = false + +export default function() { + + return { + statePlugins: { + spec: { + wrapActions: { + updateSpec: (ori) => (...args) => { + engaged = true + return ori(...args) + }, + updateJsonSpec: (ori, system) => (...args) => { + const cb = system.getConfigs().onComplete + if(engaged && typeof cb === "function") { + // call `onComplete` on next tick, which allows React to + // reconcile the DOM before we notify the user + setTimeout(cb, 0) + engaged = false + } + + return ori(...args) + } + } + } + } + } +} diff --git a/src/core/presets/base.js b/src/core/presets/base.js index 588f3c0e..e5d907af 100644 --- a/src/core/presets/base.js +++ b/src/core/presets/base.js @@ -13,6 +13,7 @@ import downloadUrlPlugin from "core/plugins/download-url" import configsPlugin from "core/plugins/configs" import deepLinkingPlugin from "core/plugins/deep-linking" import filter from "core/plugins/filter" +import onComplete from "core/plugins/on-complete" import OperationContainer from "core/containers/OperationContainer" @@ -159,6 +160,7 @@ export default function() { SplitPaneModePlugin, downloadUrlPlugin, deepLinkingPlugin, - filter + filter, + onComplete ] } diff --git a/test/e2e/helpers/index.html b/test/e2e/helpers/index.html new file mode 100644 index 00000000..6552c857 --- /dev/null +++ b/test/e2e/helpers/index.html @@ -0,0 +1,111 @@ + + + + + + + Swagger UI + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + diff --git a/test/e2e/scenarios/on-complete.js b/test/e2e/scenarios/on-complete.js new file mode 100644 index 00000000..d32cd089 --- /dev/null +++ b/test/e2e/scenarios/on-complete.js @@ -0,0 +1,22 @@ +const expect = require("expect") + +describe("onComplete option", function () { + let mainPage + beforeEach(function (client, done) { + mainPage = client + .url("localhost:3200") + .page.main() + + client.waitForElementVisible(".opblock-tag-section", 5000) + done() + }) + + it("triggers the page-provided onComplete exactly 1 times", function (client, done) { + client.execute(function() { + return window.completeCount + }, [], (result) => { + expect(result.value).toEqual(1) + client.end() + }) + }) +}) diff --git a/webpack-hot-dev-server.config.js b/webpack-hot-dev-server.config.js index 81abd40c..5ca1b041 100644 --- a/webpack-hot-dev-server.config.js +++ b/webpack-hot-dev-server.config.js @@ -63,7 +63,6 @@ module.exports = require("./make-webpack-config")(rules, { }, devServer: { port: 3200, - contentBase: path.join(__dirname, "dev-helpers"), publicPath: "/", noInfo: true, hot: true,