Merge pull request #4062 from shockey/master

v3.8.1

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.8.0 | 2017-12-15 | 2.0, 3.0 | [tag v3.8.0](https://github.com/swagger-api/swagger-ui/tree/v3.8.0)
+3.8.0 | 2017-12-15 | 2.0, 3.0 | [tag v3.8.1](https://github.com/swagger-api/swagger-ui/tree/v3.8.1)
 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)

docs/customization/plugin-api.md

@@ -19,7 +19,8 @@ A plugin return value may contain any of these keys, where `myStateKey` is a nam
   },
   components: {},
   wrapComponents: {},
-  afterLoad: (system) => {}
+  rootInjects: {},
+  afterLoad: (system) => {},
   fn: {},
 }
 ```
@@ -364,11 +365,30 @@ const MyWrapComponentPlugin = function(system) {
 }
 ```
 
+##### `rootInjects`
+
+The `rootInjects` interface allows you to inject values at the top level of the system.
+
+This interface takes an object, which will be merged in with the top-level system object at runtime.
+
+```js
+const MyRootInjectsPlugin = function(system) {
+  return {
+    rootInjects: {
+      myConstant: 123,
+      myMethod: (...params) => console.log(...params)
+    }
+  }
+}
+```
+
 ##### `afterLoad`
 
-The `afterLoad` plugin method allows you to get a reference to the system after your plugin has been registered with the system.
+The `afterLoad` plugin method allows you to get a reference to the system after your plugin has been registered.
 
-This interface is used in the core code to attach methods that are driven by bound selectors or actions directly to the system.
+This interface is used in the core code to attach methods that are driven by bound selectors or actions. You can also use it to execute logic that requires your plugin to already be ready, for example fetching initial data from a remote endpoint and passing it to an action your plugin creates.
+
+The plugin context, which is bound to `this`, is undocumented, but below is an example of how to attach a bound action as a top-level method:
 
 ```javascript
 const MyMethodProvidingPlugin = function() {
@@ -376,7 +396,8 @@ const MyMethodProvidingPlugin = function() {
     afterLoad(system) {
       // at this point in time, your actions have been bound into the system
       // so you can do things with them
-      system.myMethod = system.exampleActions.updateFavoriteColor
+      this.rootInjects = this.rootInjects || {}
+      this.rootInjects.myMethod = system.exampleActions.updateFavoriteColor
     },
     statePlugins: {
       example: {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "swagger-ui",
-  "version": "3.8.0",
+  "version": "3.8.1",
   "main": "dist/swagger-ui.js",
   "repository": "git@github.com:swagger-api/swagger-ui.git",
   "contributors": [
@@ -67,6 +67,7 @@
     "react-height": "^2.0.0",
     "react-hot-loader": "1.3.1",
     "react-immutable-proptypes": "2.1.0",
+    "react-immutable-pure-component": "^1.1.1",
     "react-markdown": "^2.5.0",
     "react-motion": "^0.5.2",
     "react-object-inspector": "0.2.1",
@@ -81,7 +82,7 @@
     "scroll-to-element": "^2.0.0",
     "serialize-error": "2.0.0",
     "shallowequal": "0.2.2",
-    "swagger-client": "^3.4.2",
+    "swagger-client": "^3.4.4",
     "url-parse": "^1.1.8",
     "whatwg-fetch": "0.11.1",
     "worker-loader": "^0.7.1",

src/core/components/array-model.jsx

@@ -1,5 +1,6 @@
 import React, { Component } from "react"
 import PropTypes from "prop-types"
+import ImPropTypes from "react-immutable-proptypes"
 
 const propStyle = { color: "#999", fontStyle: "italic" }
 
@@ -12,7 +13,7 @@ export default class ArrayModel extends Component {
     name: PropTypes.string,
     required: PropTypes.bool,
     expandDepth: PropTypes.number,
-    specPath: PropTypes.array.isRequired,
+    specPath: ImPropTypes.list.isRequired,
     depth: PropTypes.number
   }
 
@@ -48,7 +49,17 @@ export default class ArrayModel extends Component {
             !description ? null :
               <Markdown source={ description } />
           }
-          <span><Model { ...this.props } getConfigs={ getConfigs } specPath={[...specPath, "items"]} name={null} schema={ items } required={ false } depth={ depth + 1 } /></span>
+          <span>
+            <Model
+              { ...this.props }
+              getConfigs={ getConfigs }
+              specPath={specPath.push("items")}
+              name={null}
+              schema={ items }
+              required={ false }
+              depth={ depth + 1 }
+            />
+          </span>
         ]
       </ModelCollapse>
     </span>

src/core/components/model-example.jsx

@@ -1,5 +1,6 @@
 import React from "react"
 import PropTypes from "prop-types"
+import ImPropTypes from "react-immutable-proptypes"
 
 export default class ModelExample extends React.Component {
   static propTypes = {
@@ -9,7 +10,7 @@ export default class ModelExample extends React.Component {
     example: PropTypes.any.isRequired,
     isExecute: PropTypes.bool,
     getConfigs: PropTypes.func.isRequired,
-    specPath: PropTypes.array.isRequired,
+    specPath: ImPropTypes.list.isRequired,
   }
 
   constructor(props, context) {

src/core/components/model.jsx

@@ -1,8 +1,9 @@
-import React, { PureComponent } from "react"
+import React from "react"
+import ImmutablePureComponent from "react-immutable-pure-component"
 import ImPropTypes from "react-immutable-proptypes"
 import PropTypes from "prop-types"
 
-export default class Model extends PureComponent {
+export default class Model extends ImmutablePureComponent {
   static propTypes = {
     schema: ImPropTypes.orderedMap.isRequired,
     getComponent: PropTypes.func.isRequired,
@@ -13,7 +14,7 @@ export default class Model extends PureComponent {
     required: PropTypes.bool,
     expandDepth: PropTypes.number,
     depth: PropTypes.number,
-    specPath: PropTypes.array.isRequired,
+    specPath: ImPropTypes.list.isRequired,
   }
 
   getModelName =( ref )=> {

src/core/components/models.jsx

@@ -1,4 +1,5 @@
 import React, { Component } from "react"
+import Im from "immutable"
 import PropTypes from "prop-types"
 
 export default class Models extends Component {
@@ -20,7 +21,7 @@ export default class Models extends Component {
     const specPathBase = specSelectors.isOAS3() ? ["components", "schemas"] : ["definitions"]
 
     const ModelWrapper = getComponent("ModelWrapper")
-    const Collapse = getComponent("Collapse")    
+    const Collapse = getComponent("Collapse")
 
     return <section className={ showModels ? "models is-open" : "models"}>
       <h4 onClick={() => layoutActions.show("models", !showModels)}>
@@ -37,7 +38,7 @@ export default class Models extends Component {
               <ModelWrapper name={ name }
                      expandDepth={ defaultModelsExpandDepth }
                      schema={ model }
-                     specPath={[...specPathBase, name]}
+                     specPath={Im.List([...specPathBase, name])}
                      getComponent={ getComponent }
                      specSelectors={ specSelectors }
                      getConfigs = {getConfigs}

src/core/components/object-model.jsx

@@ -1,6 +1,7 @@
 import React, { Component, } from "react"
 import PropTypes from "prop-types"
 import { List } from "immutable"
+import ImPropTypes from "react-immutable-proptypes"
 
 const braceOpen = "{"
 const braceClose = "}"
@@ -17,7 +18,7 @@ export default class ObjectModel extends Component {
     isRef: PropTypes.bool,
     expandDepth: PropTypes.number,
     depth: PropTypes.number,
-    specPath: PropTypes.object.isRequired
+    specPath: ImPropTypes.list.isRequired
   }
 
   render(){
@@ -102,7 +103,7 @@ export default class ObjectModel extends Component {
                           <Model key={ `object-${name}-${key}_${value}` } { ...otherProps }
                                  required={ isRequired }
                                  getComponent={ getComponent }
-                                 specPath={[...specPath, "properties", key]}
+                                 specPath={specPath.push("properties", key)}
                                  getConfigs={ getConfigs }
                                  schema={ value }
                                  depth={ depth + 1 } />
@@ -141,7 +142,7 @@ export default class ObjectModel extends Component {
                     <td>
                       <Model { ...otherProps } required={ false }
                              getComponent={ getComponent }
-                             specPath={[...specPath, "additionalProperties"]}
+                             specPath={specPath.push("additionalProperties")}
                              getConfigs={ getConfigs }
                              schema={ additionalProperties }
                              depth={ depth + 1 } />
@@ -156,7 +157,7 @@ export default class ObjectModel extends Component {
                       {anyOf.map((schema, k) => {
                         return <div key={k}><Model { ...otherProps } required={ false }
                                  getComponent={ getComponent }
-                                 specPath={[...specPath, "anyOf", k]}
+                                 specPath={specPath.push("anyOf", k)}
                                  getConfigs={ getConfigs }
                                  schema={ schema }
                                  depth={ depth + 1 } /></div>
@@ -172,7 +173,7 @@ export default class ObjectModel extends Component {
                       {oneOf.map((schema, k) => {
                         return <div key={k}><Model { ...otherProps } required={ false }
                                  getComponent={ getComponent }
-                                 specPath={[...specPath, "oneOf", k]}
+                                 specPath={specPath.push("oneOf", k)}
                                  getConfigs={ getConfigs }
                                  schema={ schema }
                                  depth={ depth + 1 } /></div>
@@ -189,7 +190,7 @@ export default class ObjectModel extends Component {
                         <Model { ...otherProps }
                                required={ false }
                                getComponent={ getComponent }
-                               specPath={[...specPath, "not"]}
+                               specPath={specPath.push("not")}
                                getConfigs={ getConfigs }
                                schema={ not }
                                depth={ depth + 1 } />

src/core/components/operation.jsx

@@ -2,11 +2,12 @@ import React, { PureComponent } from "react"
 import PropTypes from "prop-types"
 import { getList } from "core/utils"
 import { getExtensions, sanitizeUrl } from "core/utils"
-import { Iterable } from "immutable"
+import { Iterable, List } from "immutable"
+import ImPropTypes from "react-immutable-proptypes"
 
 export default class Operation extends PureComponent {
   static propTypes = {
-    specPath: PropTypes.array.isRequired,
+    specPath: ImPropTypes.list.isRequired,
     operation: PropTypes.instanceOf(Iterable).isRequired,
     response: PropTypes.instanceOf(Iterable),
     request: PropTypes.instanceOf(Iterable),
@@ -33,7 +34,7 @@ export default class Operation extends PureComponent {
     operation: null,
     response: null,
     request: null,
-    specPath: []
+    specPath: List()
   }
 
   render() {
@@ -174,7 +175,7 @@ export default class Operation extends PureComponent {
 
               <Parameters
                 parameters={parameters}
-                specPath={[...specPath, "parameters"]}
+                specPath={specPath.push("parameters")}
                 operation={operation}
                 onChangeKey={onChangeKey}
                 onTryoutClick = { onTryoutClick }
@@ -248,7 +249,7 @@ export default class Operation extends PureComponent {
                     specActions={ specActions }
                     produces={ produces }
                     producesValue={ operation.get("produces_value") }
-                    specPath={[...specPath, "responses"]}
+                    specPath={specPath.push("responses")}
                     path={ path }
                     method={ method }
                     displayRequestDuration={ displayRequestDuration }

src/core/components/operations.jsx

@@ -1,5 +1,6 @@
 import React from "react"
 import PropTypes from "prop-types"
+import Im from "immutable"
 import { createDeepLinkPath, sanitizeUrl } from "core/utils"
 
 const SWAGGER2_OPERATION_METHODS = [
@@ -119,7 +120,7 @@ export default class Operations extends React.Component {
                       operations.map( op => {
                         const path = op.get("path")
                         const method = op.get("method")
-                        const specPath = ["paths", path, method]
+                        const specPath = Im.List(["paths", path, method])
 
 
                         // FIXME: (someday) this logic should probably be in a selector,

src/core/components/parameter-row.jsx

@@ -1,6 +1,7 @@
 import React, { Component } from "react"
 import { Map } from "immutable"
 import PropTypes from "prop-types"
+import ImPropTypes from "react-immutable-proptypes"
 import win from "core/window"
 import { getExtensions } from "core/utils"
 
@@ -15,7 +16,7 @@ export default class ParameterRow extends Component {
     specSelectors: PropTypes.object.isRequired,
     pathMethod: PropTypes.array.isRequired,
     getConfigs: PropTypes.func.isRequired,
-    specPath: PropTypes.array.isRequired,
+    specPath: ImPropTypes.list.isRequired
   }
 
   constructor(props, context) {
@@ -139,7 +140,7 @@ export default class ParameterRow extends Component {
 
           {
             bodyParam && schema ? <ModelExample getComponent={ getComponent }
-                                                specPath={[...specPath, "schema"]}
+                                                specPath={specPath.push("schema")}
                                                 getConfigs={ getConfigs }
                                                 isExecute={ isExecute }
                                                 specSelectors={ specSelectors }

src/core/components/parameters.jsx

@@ -21,7 +21,7 @@ export default class Parameters extends Component {
     onChangeKey: PropTypes.array,
     pathMethod: PropTypes.array.isRequired,
     getConfigs: PropTypes.func.isRequired,
-    specPath: PropTypes.array.isRequired,
+    specPath: ImPropTypes.list.isRequired,
   }
 
 
@@ -98,7 +98,7 @@ export default class Parameters extends Component {
                   eachMap(parameters, (parameter, i) => (
                     <ParameterRow
                       fn={ fn }
-                      specPath={[...specPath, i]}
+                      specPath={specPath.push(i.toString())}
                       getComponent={ getComponent }
                       getConfigs={ getConfigs }
                       param={ parameter }

src/core/components/response.jsx

@@ -1,7 +1,8 @@
 import React from "react"
 import PropTypes from "prop-types"
+import ImPropTypes from "react-immutable-proptypes"
 import cx from "classnames"
-import { fromJS, Seq, Iterable } from "immutable"
+import { fromJS, Seq, Iterable, List } from "immutable"
 import { getSampleSchema, fromJSOrdered } from "core/utils"
 
 const getExampleComponent = ( sampleResponse, examples, HighlightCode ) => {
@@ -47,7 +48,7 @@ export default class Response extends React.Component {
     getComponent: PropTypes.func.isRequired,
     getConfigs: PropTypes.func.isRequired,
     specSelectors: PropTypes.object.isRequired,
-    specPath: PropTypes.array.isRequired,
+    specPath: ImPropTypes.list.isRequired,
     fn: PropTypes.object.isRequired,
     contentType: PropTypes.string,
     controlsAcceptHeader: PropTypes.bool,
@@ -99,7 +100,7 @@ export default class Response extends React.Component {
     var schema, specPathWithPossibleSchema
 
     if(isOAS3()) {
-      const schemaPath = ["content", this.state.responseContentType, "schema"]
+      const schemaPath = List(["content", this.state.responseContentType, "schema"])
       const oas3SchemaForContentType = response.getIn(schemaPath)
       sampleResponse = oas3SchemaForContentType ? getSampleSchema(oas3SchemaForContentType.toJS(), this.state.responseContentType, {
         includeReadOnly: true
@@ -108,7 +109,7 @@ export default class Response extends React.Component {
       specPathWithPossibleSchema = oas3SchemaForContentType ? schemaPath : specPath
     } else {
       schema = inferSchema(response.toJS()) // TODO: don't convert back and forth. Lets just stick with immutable for inferSchema
-      specPathWithPossibleSchema = response.has("schema") ? [...specPath, "schema"] : specPath
+      specPathWithPossibleSchema = response.has("schema") ? specPath.push("schema") : specPath
       sampleResponse = schema ? getSampleSchema(schema, contentType, {
         includeReadOnly: true,
         includeWriteOnly: true // writeOnly has no filtering effect in swagger 2.0

src/core/components/responses.jsx

@@ -1,6 +1,7 @@
 import React from "react"
-import PropTypes from "prop-types"
 import { fromJS, Iterable } from "immutable"
+import PropTypes from "prop-types"
+import ImPropTypes from "react-immutable-proptypes"
 import { defaultStatusCode, getAcceptControllingResponse } from "core/utils"
 
 export default class Responses extends React.Component {
@@ -17,7 +18,7 @@ export default class Responses extends React.Component {
     specSelectors: PropTypes.object.isRequired,
     specActions: PropTypes.object.isRequired,
     oas3Actions: PropTypes.object.isRequired,
-    specPath: PropTypes.array.isRequired,
+    specPath: ImPropTypes.list.isRequired,
     fn: PropTypes.object.isRequired
   }
 
@@ -120,7 +121,7 @@ export default class Responses extends React.Component {
                   let className = tryItOutResponse && tryItOutResponse.get("status") == code ? "response_current" : ""
                   return (
                     <Response key={ code }
-                              specPath={[...specPath, code]}
+                              specPath={specPath.push(code)}
                               isDefault={defaultCode === code}
                               fn={fn}
                               className={ className }

src/core/containers/OperationContainer.jsx

@@ -1,5 +1,6 @@
 import React, { PureComponent } from "react"
 import PropTypes from "prop-types"
+import ImPropTypes from "react-immutable-proptypes"
 import { helpers } from "swagger-client"
 import { Iterable, fromJS } from "immutable"
 
@@ -31,8 +32,7 @@ export default class OperationContainer extends PureComponent {
     request: PropTypes.instanceOf(Iterable),
     security: PropTypes.instanceOf(Iterable),
     isDeepLinkingEnabled: PropTypes.bool.isRequired,
-    specPath: PropTypes.array.isRequired,
-
+    specPath: ImPropTypes.list.isRequired,
     getComponent: PropTypes.func.isRequired,
     authActions: PropTypes.object,
     oas3Actions: PropTypes.object,

src/core/plugins/auth/index.js

@@ -6,7 +6,8 @@ import * as specWrapActionReplacements from "./spec-wrap-actions"
 export default function() {
   return {
     afterLoad(system) {
-      system.initOAuth = system.authActions.configureAuth
+      this.rootInjects = this.rootInjects || {}
+      this.rootInjects.initOAuth = system.authActions.configureAuth
     },
     statePlugins: {
       auth: {

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

@@ -38,7 +38,7 @@ const RequestBody = ({
       expandDepth={1}
       isExecute={isExecute}
       schema={mediaTypeValue.get("schema")}
-      specPath={[...specPath, "content", contentType]}
+      specPath={specPath.push("content", contentType)}
       example={<RequestBodyEditor
         requestBody={requestBody}
         onChange={onChange}

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

@@ -29,7 +29,7 @@ class Parameters extends Component {
     fn: PropTypes.object.isRequired,
     tryItOutEnabled: PropTypes.bool,
     allowTryItOut: PropTypes.bool,
-    specPath: PropTypes.array.isRequired,
+    specPath: ImPropTypes.list.isRequired,
     onTryoutClick: PropTypes.func,
     onCancelClick: PropTypes.func,
     onChangeKey: PropTypes.array,
@@ -107,7 +107,7 @@ class Parameters extends Component {
     const { isOAS3 } = specSelectors
 
     const requestBody = operation.get("requestBody")
-    const requestBodySpecPath = [...specPath.slice(0, -1), "requestBody"] // remove the "parameters" part
+    const requestBodySpecPath = specPath.slice(0, -1).push("requestBody") // remove the "parameters" part
 
     return (
       <div className="opblock-section">
@@ -143,7 +143,7 @@ class Parameters extends Component {
                     eachMap(parameters, (parameter, i) => (
                       <ParameterRow fn={ fn }
                         getComponent={ getComponent }
-                        specPath={[...specPath, i]}
+                        specPath={specPath.push(i)}
                         getConfigs={ getConfigs }
                         param={ parameter }
                         key={ parameter.get( "name" ) }

src/core/system.js

@@ -68,13 +68,11 @@ export default class Store {
     if(rebuild) {
       this.buildSystem()
     }
-    
-    if(Array.isArray(plugins)) {
-      plugins.forEach(plugin => {
-        if(plugin.afterLoad) {
-          plugin.afterLoad(this.getSystem())
-        }
-      })
+
+    const needAnotherRebuild = callAfterLoad.call(this.system, plugins, this.getSystem())
+
+    if(needAnotherRebuild) {
+      this.buildSystem()
     }
   }
 
@@ -328,6 +326,25 @@ function combinePlugins(plugins, toolbox) {
   return {}
 }
 
+function callAfterLoad(plugins, system, { hasLoaded } = {}) {
+  let calledSomething = hasLoaded
+  if(isObject(plugins) && !isArray(plugins)) {
+    if(typeof plugins.afterLoad === "function") {
+      calledSomething = true
+      plugins.afterLoad.call(this, system)
+    }
+  }
+
+  if(isFunc(plugins))
+    return callAfterLoad.call(this, plugins(system), system, { hasLoaded: calledSomething })
+
+  if(isArray(plugins)) {
+    return plugins.map(plugin => callAfterLoad.call(this, plugin, system, { hasLoaded: calledSomething }))
+  }
+
+  return calledSomething
+}
+
 // Wraps deepExtend, to account for certain fields, being wrappers.
 // Ie: we need to convert some fields into arrays, and append to them.
 // Rather than overwrite

test/components/object-model.js

@@ -1,7 +1,7 @@
 import React from "react"
 import expect from "expect"
 import { shallow } from "enzyme"
-import { fromJS } from "immutable"
+import { fromJS, List } from "immutable"
 import ObjectModel from "components/object-model"
 import ModelExample from "components/model-example"
 import Immutable from "immutable"
@@ -25,7 +25,7 @@ describe("<ObjectModel />", function() {
         }
       },
       isRef : false,
-      specPath: [],
+      specPath: List(),
       schema: Immutable.fromJS(
         {
           "properties": {

test/core/system/system.js

@@ -684,13 +684,13 @@ describe("bound system", function(){
   })
 
   describe("afterLoad", function() {
-    it("should call an plugin's `afterLoad` method after the plugin is loaded", function() {
+    it("should call a plugin's `afterLoad` method after the plugin is loaded", function() {
       // Given
       const system = new System({
         plugins: [
           {
             afterLoad(system) {
-              system.wow = system.dogeSelectors.wow
+              this.rootInjects.wow = system.dogeSelectors.wow
             },
             statePlugins: {
               doge: {
@@ -705,6 +705,89 @@ describe("bound system", function(){
         ]
       })
 
+      // When
+      var res = system.getSystem().wow()
+      expect(res).toEqual("so selective")
+    })
+    it("should call a preset plugin's `afterLoad` method after the plugin is loaded", function() {
+      // Given
+      const MyPlugin = {
+        afterLoad(system) {
+          this.rootInjects.wow = system.dogeSelectors.wow
+        },
+        statePlugins: {
+          doge: {
+            selectors: {
+              wow: () => (system) => {
+                return "so selective"
+              }
+            }
+          }
+        }
+      }
+
+      const system = new System({
+        plugins: [
+          [MyPlugin]
+        ]
+      })
+
+      // When
+      var res = system.getSystem().wow()
+      expect(res).toEqual("so selective")
+    })
+    it("should call a function preset plugin's `afterLoad` method after the plugin is loaded", function() {
+      // Given
+      const MyPlugin = {
+        afterLoad(system) {
+          this.rootInjects.wow = system.dogeSelectors.wow
+        },
+        statePlugins: {
+          doge: {
+            selectors: {
+              wow: () => (system) => {
+                return "so selective"
+              }
+            }
+          }
+        }
+      }
+
+      const system = new System({
+        plugins: [
+          () => {
+            return [MyPlugin]
+          }
+        ]
+      })
+
+      // When
+      var res = system.getSystem().wow()
+      expect(res).toEqual("so selective")
+    })
+    it("should call a registered plugin's `afterLoad` method after the plugin is loaded", function() {
+      // Given
+      const MyPlugin = {
+        afterLoad(system) {
+          this.rootInjects.wow = system.dogeSelectors.wow
+        },
+        statePlugins: {
+          doge: {
+            selectors: {
+              wow: () => (system) => {
+                return "so selective"
+              }
+            }
+          }
+        }
+      }
+
+      const system = new System({
+        plugins: []
+      })
+
+      system.register([MyPlugin])
+
       // When
       var res = system.getSystem().wow()
       expect(res).toEqual("so selective")