add more tests 👍

mzabriskie · Jul 13, 2016 · 812095e · 812095e
1 parent 700c975
commit 812095e
Show file tree

Hide file tree

Showing 6 changed files with 49 additions and 8 deletions.
diff --git a/app/screens/User/components/ProfileStat.test.js b/app/screens/User/components/ProfileStat.test.js
@@ -2,20 +2,20 @@ import React from 'react'
 import {render} from 'enzyme'
 import ProfileStat from './ProfileStat'
 
-describe('ProfileStat', () => {
+describe(ProfileStat.displayName, () => {
   it('should render the `value` in <h2>', () => {
     const value = 42
-    const wrapper = renderDefaults({value})
+    const wrapper = renderComponent({value})
     expect(wrapper.find('h2')).to.contain.text(value)
   })
 
   it('should render the `label` in <small>', () => {
     const label = 'Snickers'
-    const wrapper = renderDefaults({label})
+    const wrapper = renderComponent({label})
     expect(wrapper.find('small')).to.contain.text(label)
   })
 })
 
-function renderDefaults(props = {value: 12, label: 'Candy'}) {
+function renderComponent(props = {value: 12, label: 'Candy'}) {
   return render(<ProfileStat {...props} />)
 }
diff --git a/app/screens/User/components/RepoFilter.js b/app/screens/User/components/RepoFilter.js
@@ -11,8 +11,8 @@ export default React.createClass({
     };
   },
 
-  handleInputKeyUp() {
-    this.props.onKeyUp(this._input.value);
+  handleInputKeyUp({target: {value}}) {
+    this.props.onKeyUp(value);
   },
 
   render() {
@@ -22,7 +22,6 @@ export default React.createClass({
           type="text"
           placeholder="Filter repositories..."
           className="form-control"
-          ref={ref => this._input = ref}
           onKeyUp={this.handleInputKeyUp}
         />
       </section>

diff --git a/app/screens/User/components/RepoFilter.test.js b/app/screens/User/components/RepoFilter.test.js
@@ -0,0 +1,29 @@
+import React from 'react'
+import {mount} from 'enzyme'
+import RepoFilter from './RepoFilter'
+import sinon from 'sinon'
+
+describe(RepoFilter.displayName, () => {
+  it('should call the onKeyUp prop', () => {
+    const onKeyUp = sinon.spy()
+    const wrapper = mountComponent({onKeyUp})
+    const input = wrapper.find('input')
+    const key = 'b'
+    input.simulate('keyup', {target: {value: key}})
+    expect(onKeyUp).to.have.been.calledWith(key)
+  })
+
+  it('should have a default onKeyUp handler', () => {
+    const wrapper = mountComponent()
+    const input = wrapper.find('input')
+    expect(() => input.simulate('keyup')).to.not.throw()
+  })
+})
+
+function mountComponent(props) {
+  return mount(<RepoFilter {...props}/>)
+}
+
+function setInputValue(input, value) {
+  input.simulate('change', {target: {value}});
+}
diff --git a/package.json b/package.json
@@ -45,9 +45,12 @@
     "css-loader": "0.23.1",
     "enzyme": "2.4.1",
     "file-loader": "0.9.0",
+    "jsdom": "9.4.1",
     "mocha": "2.5.3",
     "nyc": "7.0.0",
     "react-addons-test-utils": "15.2.1",
+    "sinon": "1.17.4",
+    "sinon-chai": "2.8.0",
     "style-loader": "^0.13.0",
     "webpack": "2.1.0-beta.15",
     "webpack-dev-server": "2.1.0-beta.0",

diff --git a/test/helpers/setup.js b/test/helpers/setup.js
@@ -1,4 +1,13 @@
+import {jsdom} from 'jsdom'
 import chai from 'chai'
 import chaiEnzyme from 'chai-enzyme'
+import sinonChai from 'sinon-chai'
+
 chai.use(chaiEnzyme())
+chai.use(sinonChai)
 global.expect = chai.expect
+
+global.document = jsdom('<body></body>')
+global.window = document.defaultView
+global.navigator = window.navigator
+global.location = window.location
diff --git a/webpack.config.js b/webpack.config.js
@@ -12,7 +12,8 @@ module.exports = env => {
     context: __dirname,
     output: {
       path: resolve(__dirname, './build'),
-      filename: 'bundle.js'
+      filename: 'bundle.js',
+      publicPath: '/build/',
     },
     devtool: ifProd('source-map', 'eval'),
     module: {