test(Checkbox): add onChange test

src/modules/Checkbox/Checkbox.js

@@ -112,10 +112,6 @@ export default class Checkbox extends AutoControlledComponent {
   render() {
     const { className, inputType, label, name, onChange, type, value } = this.props
     const { checked } = this.state
-    debug('render()')
-    debug(`  name:       ${name}`)
-    debug(`  value:      ${value}`)
-    debug(`  checked:    ${checked}`)
     const classes = cx(
       'ui',
       // don't add duplicate "checkbox" classes, but add any other type
@@ -128,21 +124,22 @@ export default class Checkbox extends AutoControlledComponent {
       className
     )
     const rest = getUnhandledProps(Checkbox, this.props)
+    // Heads Up!
+    // onChange props are never called as the user cannot click on the hidden input.
+    // We call onChange in the onClick handler.
+    // This exists only to prevent React "prop checked without onChange" warnings.
     return (
-      // Heads Up!
-      // onChange is never called because the user cannot click on the hidden input.
-      // We call onChange in the onClick handler.
-      // This exists only to prevent React "prop checked without onChange" warnings.
       <div
+        {...rest}
         className={classes}
         onClick={this.handleClick}
-        onChange={onChange}
-        {...rest}
+        onChange={onChange || _.noop}
       >
         <input
           ref='input'
           type={inputType || typeMap[type]}
           name={name}
+          onChange={onChange || _.noop}
           checked={checked}
           className='hidden'
           tabIndex={0}

test/specs/modules/Checkbox/Checkbox-test.js

@@ -12,7 +12,7 @@ describe('Checkbox', () => {
   describe('defaultChecked', () => {
     it('sets the initial checked state', () => {
       // consoleUtil.disableOnce()
-      shallow(<Checkbox defaultChecked onChange={_.noop} />)
+      shallow(<Checkbox defaultChecked />)
         .find('input')
         .should.be.checked()
     })
@@ -88,13 +88,32 @@ describe('Checkbox', () => {
   })
 
   describe('onClick', () => {
-    it('is called on label click', () => {
+    it('is called with (event { name, value, checked }) on label click', () => {
       const spy = sandbox.spy()
-      mount(<Checkbox onClick={spy} />)
+      const expectProps = { name: 'foo', value: 'bar', checked: false }
+      mount(<Checkbox onClick={spy} {...expectProps} />)
         .find('label')
         .simulate('click')
 
       spy.should.have.been.calledOnce()
+      spy.should.have.been.calledWithMatch({}, {})
+      spy.firstCall.args[1]
+        .should.deep.equal(expectProps)
+    })
+  })
+
+  describe('onChange', () => {
+    it('is called with (event { name, value, !checked }) on click', () => {
+      const spy = sandbox.spy()
+      const expectProps = { name: 'foo', value: 'bar', checked: false }
+      mount(<Checkbox onChange={spy} {...expectProps} />)
+        .find('label')
+        .simulate('click')
+
+      spy.should.have.been.calledOnce()
+      spy.should.have.been.calledWithMatch({}, {})
+      spy.firstCall.args[1]
+        .should.deep.equal({ ...expectProps, checked: true })
     })
   })