feat(Views): add ability to extend hoc and container

packages/cerebral/src/utils.js

@@ -1,6 +1,8 @@
-export function addExtensions(target, extensions) {
+export function addExtensions (target, extensions) {
   return extensions.reduce((currentTarget, extension) => {
-    return Object.assign(currentTarget, extension)
+    const extensionObj = typeof extension === 'function' ? extension(currentTarget) : extension
+
+    return Object.assign(currentTarget, extensionObj)
   }, target)
 }
 

packages/cerebral/src/viewFactories/Container.js

@@ -1,11 +1,14 @@
 /* global CustomEvent */
 import DependencyStore from '../DependencyStore'
-import {ensurePath} from '../utils'
+import {ensurePath, addExtensions} from '../utils'
 
 export default (View) => {
   class Container extends View.Component {
     constructor (props) {
       super(props)
+      if (this.props.controller && this.props.controller.extend.container) {
+        addExtensions(this, this.props.controller.extend.container)
+      }
       this.dependencyStore = new DependencyStore()
       this.debuggerComponentsMap = {}
       this.debuggerComponentDetailsId = 1
@@ -61,6 +64,7 @@ export default (View) => {
     */
     createDummyController (state = {}) {
       return {
+        extend: {},
         on () {},
         getState (path) {
           return ensurePath(path).reduce((currentState, pathKey) => {

packages/cerebral/src/viewFactories/Hoc.js

@@ -1,11 +1,14 @@
 import {Computed} from './../Computed'
-import {cleanPath, propsDiffer} from './../utils'
+import {cleanPath, propsDiffer, addExtensions} from './../utils'
 
 export default (View) => {
   return function HOC (paths, signals, Component) {
     class CerebralComponent extends View.Component {
-      constructor (props) {
+      constructor (props, context) {
         super(props)
+        if (context.cerebral.controller.extend.hoc) {
+          addExtensions(this, context.cerebral.controller.extend.hoc)
+        }
         this.evaluatedPaths = this.getStatePaths(props)
         this.signals = signals
         this.Component = Component

packages/cerebral/tests/react.js

@@ -245,6 +245,87 @@ describe('React', () => {
       component.changePath()
       assert.equal(TestUtils.findRenderedDOMComponentWithTag(tree, 'div').innerHTML, 'bar2')
     })
+    it('should be able to extend HOC', () => {
+      const controller = Controller({
+        extend: {
+          hoc: [(hoc) => {
+            const originalGetProps = hoc.getProps
+
+            return {
+              getProps (...args) {
+                const props = originalGetProps.apply(hoc, args)
+                props.foo = 'bar'
+
+                return props
+              }
+            }
+          }]
+        }
+      })
+      class TestComponentClass extends React.Component {
+        render () {
+          return (
+            <div>{this.props.foo}</div>
+          )
+        }
+      }
+      const TestComponent = connect({}, TestComponentClass)
+      const tree = TestUtils.renderIntoDocument((
+        <Container controller={controller}>
+          <TestComponent />
+        </Container>
+      ))
+      assert.equal(TestUtils.findRenderedDOMComponentWithTag(tree, 'div').innerHTML, 'bar')
+    })
+    it('should be able to extend Container', () => {
+      const controller = Controller({
+        extend: {
+          container: [{
+            getChildContext () {
+              const controller = (
+                this.props.controller ||
+                this.createDummyController(this.props.state)
+              )
+              return {
+                cerebral: {
+                  controller: controller,
+                  registerComponent: this.registerComponent,
+                  unregisterComponent: this.unregisterComponent,
+                  updateComponent: this.updateComponent,
+                  foo: 'bar'
+                }
+              }
+            }
+          }],
+          hoc: [(hoc) => {
+            const originalGetProps = hoc.getProps
+
+            return {
+              getProps (...args) {
+                const props = originalGetProps.apply(hoc, args)
+                props.foo = this.context.cerebral.foo
+
+                return props
+              }
+            }
+          }]
+        }
+      })
+      class TestComponentClass extends React.Component {
+        render () {
+          return (
+            <div>{this.props.foo}</div>
+          )
+        }
+      }
+      const TestComponent = connect({}, TestComponentClass)
+      const tree = TestUtils.renderIntoDocument((
+        <Container controller={controller}>
+          <TestComponent />
+        </Container>
+      ))
+      assert.equal(TestUtils.findRenderedDOMComponentWithTag(tree, 'div').innerHTML, 'bar')
+    })
     describe('STRICT render update', () => {
       it('should not update when parent path changes', () => {
         let renderCount = 0