Fix the CheckBox component's onChange parameters (#26)

* Fix the CheckBox component's onChange parameters

* Fix lint error

README.md

@@ -60,6 +60,12 @@ Paragon uses [Jest](https://facebook.github.io/jest/) with [Enzyme](https://gith
 
 Paragon also uses Airbnb's [Enzyme](http://airbnb.io/enzyme/) library to help render our components within unit tests. Enzyme comes with a number of utilities for shallow rendering, mounting components, querying the DOM, simulating DOM events, and querying React components themselves. Read [the docs](http://airbnb.io/enzyme/docs/api/index.html) for more details.
 
+To run the unit tests, run:
+
+```
+yarn run test
+```
+
 To add unit tests for a component, create a file in your component's directory named `<ComponentName>.test.js`. Jest will automatically pick up this file and run the tests as part of the suite. Take a look at [Dropdown.test.jsx](https://github.com/edx/paragon/blob/master/src/Dropdown/Dropdown.test.jsx) or [CheckBox.test.jsx](https://github.com/edx/paragon/blob/master/src/CheckBox/CheckBox.test.jsx) for examples of good component unit tests.
 
 ### Snapshot Testing

src/CheckBox/CheckBox.test.jsx

@@ -48,8 +48,14 @@ describe('<CheckBox />', () => {
     );
 
     expect(spy).toHaveBeenCalledTimes(0);
-    wrapper.find('input').simulate('change');
+    // check
+    wrapper.find('input').simulate('change', { target: { checked: true, type: 'checkbox' } });
     expect(spy).toHaveBeenCalledTimes(1);
+    expect(spy).toHaveBeenLastCalledWith(true, 'checkbox');
+    // uncheck
+    wrapper.find('input').simulate('change', { target: { checked: false, type: 'checkbox' } });
+    expect(spy).toHaveBeenCalledTimes(2);
+    expect(spy).toHaveBeenLastCalledWith(false, 'checkbox');
   });
 
   it('checks if start state can be set to checked', () => {

src/CheckBox/README.md

@@ -10,6 +10,7 @@ The following parameters can optionally be passed into a checkbox component:
 * `checked` (`Boolean`): `true` if the default state should be checked, `false` otherwise
 * `disabled` (`Boolean`): `true` if the checkbox should be disabled, `false` otherwise
 * `onChange`: function to be called when the checkbox changes state
+  * Function will be called with the arguments: `checked` (`Boolean`), `name` (`String`)
 
 The implementation of the checkbox contains the following functions:
 * `constructor()`: The constructor sets the `id` for the checkbox and sets whether the initial state should be checked or unchecked

src/asInput/index.jsx

@@ -80,7 +80,10 @@ const asInput = (WrappedComponent, labelFirst = true) => {
 
     handleChange(event) {
       this.setState({ value: event.target.value });
-      this.props.onChange(event.target.value, this.props.name);
+      this.props.onChange(
+        event.target.type === 'checkbox' ? event.target.checked : event.target.value,
+        this.props.name,
+      );
     }
 
     render() {