Merge c05bdf4 into 0003ef4

helpscout · Apr 29, 2019 · 3f8e64e · 3f8e64e
2 parents 0003ef4 + c05bdf4
commit 3f8e64e
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 16 deletions.
diff --git a/src/hoc/StatefulReactView/StatefulReactView.js b/src/hoc/StatefulReactView/StatefulReactView.js
@@ -7,12 +7,12 @@ const StatefulReactView = (View = Marionette.ItemView) => {
   const RV = ReactView(View)
   return RV.extend({
     initialize({store}) {
-      View.prototype.initialize.apply(this, arguments)
+      RV.prototype.initialize.apply(this, arguments)
       this.__store = store
     },
 
-    renderComponent: function () {
-      return <Provider store={ this.__store }>{ this.template() }</Provider>
+    renderComponent: function() {
+      return <Provider store={this.__store}>{this.template()}</Provider>
     },
 
     render() {

diff --git a/src/hoc/StatefulReactView/__tests__/StatefulReactView.test.js b/src/hoc/StatefulReactView/__tests__/StatefulReactView.test.js
@@ -1,16 +1,17 @@
-import React, { Component } from 'react'
+import React, {Component} from 'react'
+import ReactDOM from 'react-dom'
 import StatefulReactView from '../StatefulReactView'
 import Marionette from 'backbone.marionette'
 import {destroyRegion, makeRegion} from '../../../util/regionHelpers'
 import createStore from '../../../util/createStore'
-import { connect } from 'react-redux'
+import {connect} from 'react-redux'
 
 class Foo extends Component {
   render() {
     return <h1>Hello, {this.props.name}!</h1>
   }
 }
-const mapStateToProps = ({ name }) => ({ name })
+const mapStateToProps = ({name}) => ({name})
 const FooContainer = connect(mapStateToProps)(Foo)
 
 describe('StatefulReactView tests', () => {
@@ -21,14 +22,15 @@ describe('StatefulReactView tests', () => {
       name: 'Bob',
     }
     reducers = {
-      name: (state='', action) => action.type === 'SET_NAME' ? action.name : state
+      name: (state = '', action) =>
+        action.type === 'SET_NAME' ? action.name : state,
     }
-    store = createStore({ preloadedState, reducers })
+    store = createStore({preloadedState, reducers})
     region = makeRegion()
     View = StatefulReactView(
       Marionette.ItemView.extend({
         template() {
-          return <FooContainer/>
+          return <FooContainer />
         },
       }),
     )
@@ -38,7 +40,7 @@ describe('StatefulReactView tests', () => {
   })
 
   test('should render a StatefulReactView with data from store', () => {
-    const view = new View({ store })
+    const view = new View({store})
     region.show(view)
     expect(view.$el).toContainText('Hello, Bob!')
   })
@@ -47,29 +49,39 @@ describe('StatefulReactView tests', () => {
     View = StatefulReactView()
     View = View.extend({
       template() {
-        return <FooContainer/>
+        return <FooContainer />
       },
     })
-    const view = new View({ store })
+    const view = new View({store})
     region.show(view)
     expect(view.$el).toContainText('Hello, Bob!')
   })
 
   test('content should update when state changes', () => {
-    const view = new View({ store })
+    const view = new View({store})
     region.show(view)
     expect(view.$el).toContainText('Hello, Bob!')
-    store.dispatch({ type: 'SET_NAME', name: 'Jill'})
+    store.dispatch({type: 'SET_NAME', name: 'Jill'})
     expect(view.$el).toContainText('Hello, Jill!')
   })
 
   test('should be able to rerender', () => {
-    const view = new View({ store })
+    const view = new View({store})
     region.show(view)
     expect(view.$el).toContainText('Hello, Bob!')
     view.render()
     expect(view.$el).toContainText('Hello, Bob!')
-    store.dispatch({ type: 'SET_NAME', name: 'Jill'})
+    store.dispatch({type: 'SET_NAME', name: 'Jill'})
     expect(view.$el).toContainText('Hello, Jill!')
   })
+
+  test('should teardown on close', () => {
+    const spy = jest.spyOn(ReactDOM, 'unmountComponentAtNode')
+    const view = new View({store})
+
+    view.close()
+
+    expect(spy).toHaveBeenCalled()
+    spy.mockRestore()
+  })
 })