wrote several tests for checkbox; made some small edits in component

.eslintrc.json

@@ -7,5 +7,8 @@
   },
   "settings": {
     "import/resolver": "webpack"
+  },
+  "env": {
+    "jest": true
   }
 }

__tests__/checkbox-test.jsx

+/* eslint-disable no-console */
 import React from 'react';
 import { shallow, mount } from 'enzyme';
 import CheckBox from '../src/CheckBox';
@@ -10,8 +11,8 @@ describe('<CheckBox />', () => {
         describedBy="this is a checkbox"
         label="check me out!"
         checked="false"
-      />
-    )
+      />,
+  );
 
     expect(wrapper.find('[name="checkbox"]').exists()).toEqual(true);
     expect(wrapper.find('[type="checkbox"]').exists()).toEqual(true);
@@ -42,7 +43,7 @@ describe('<CheckBox />', () => {
     expect(wrapper.find('[aria-checked=true]').exists()).toEqual(false);
   });
 
-  it('check that callback function is triggered when clicked', ()=> {
+  it('check that callback function is triggered when clicked', () => {
     const wrapper = shallow(
       <CheckBox
         name="checkbox"
@@ -84,7 +85,7 @@ describe('<CheckBox />', () => {
         describedBy="checkbox"
         label="I am disabled"
         checked="false"
-        disabled={true}
+        disabled
       />,
     );
 

src/CheckBox.jsx

 import React from 'react';
 
 import { inputProps } from './utils/asInput';
+import newId from './utils/newId';
 
 
 class CheckBox extends React.Component {
@@ -12,12 +13,15 @@ class CheckBox extends React.Component {
       this.onChange = this.props.onChange.bind(this);
     }
 
+    const id = newId('checkbox');
     if (props.checked === 'true') {
       this.state = {
+        id,
         checked: true,
       };
     } else {
       this.state = {
+        id,
         checked: false,
       };
     }
@@ -33,7 +37,7 @@ class CheckBox extends React.Component {
         checked: true,
       });
     }
-    if(this.onChange) {
+    if (this.onChange) {
       this.onChange();
     }
   }
@@ -43,8 +47,9 @@ class CheckBox extends React.Component {
     const props = { ...this.props };
 
     return (
-      <label>
+      <label htmlFor={this.state.id}>
         <input
+          id={this.state.id}
           name={props.name}
           type="checkbox"
           defaultChecked={this.state.checked}

stories/index.jsx

 /* eslint-disable import/no-extraneous-dependencies */
+/* eslint-disable no-console */
 import React from 'react';
 import { storiesOf, linkTo } from '@kadira/storybook';
 
@@ -141,7 +142,7 @@ storiesOf('CheckBox', module)
       describedBy="checkbox"
       label="you cannot check me out"
       checked="false"
-      disabled="true"
+      disabled
     />
   ))
   .add('default checked', () => (