fix breaking tests

.gitattributes

+yarn.lock binary

.storybook/__snapshots__/Storyshots.test.js.snap

@@ -76,12 +76,81 @@ exports[`Storyshots CheckBox disabled 1`] = `
 </label>
 `;
 
+exports[`Storyshots Dropdown basic usage 1`] = `
+<div
+  className="paragon-component dropdown"
+>
+  <button
+    aria-expanded={false}
+    aria-haspopup="true"
+    buttonType="secondary"
+    className="btn border-0 dropdown-toggle btn-secondary"
+    classNames={
+      Array [
+        "border-0",
+        "dropdown-toggle",
+      ]
+    }
+    display="Search Engines"
+    inputRef={[Function]}
+    onBlur={[Function]}
+    onClick={[Function]}
+    onKeyDown={[Function]}
+    type="button"
+  >
+    Search Engines
+  </button>
+  <ul
+    aria-hidden={true}
+    aria-label="Search Engines"
+    className="dropdown-menu"
+    role="menu"
+  >
+    <li
+      className="dropdown-item"
+    >
+      <a
+        href="https://google.com"
+        onKeyDown={[Function]}
+        role="menuitem"
+        tabIndex="-1"
+      >
+        Google
+      </a>
+    </li>
+    <li
+      className="dropdown-item"
+    >
+      <a
+        href="https://duckduckgo.com"
+        onKeyDown={[Function]}
+        role="menuitem"
+        tabIndex="-1"
+      >
+        DuckDuckGo
+      </a>
+    </li>
+    <li
+      className="dropdown-item"
+    >
+      <a
+        href="https://yahoo.com"
+        onKeyDown={[Function]}
+        role="menuitem"
+        tabIndex="-1"
+      >
+        Yahoo
+      </a>
+    </li>
+  </ul>
+</div>
+`;
+
 exports[`Storyshots InputSelect basic usage 1`] = `
 <div
   className="form-group"
 >
   <label
-    className=""
     htmlFor="textInput5"
   >
     Fruits
@@ -124,7 +193,6 @@ exports[`Storyshots InputSelect separate labels and values 1`] = `
   className="form-group"
 >
   <label
-    className=""
     htmlFor="textInput6"
   >
     New England States
@@ -177,7 +245,6 @@ exports[`Storyshots InputSelect separate option groups 1`] = `
   className="form-group"
 >
   <label
-    className=""
     htmlFor="textInput7"
   >
     Northeast States
@@ -278,7 +345,6 @@ exports[`Storyshots InputSelect with validation 1`] = `
   className="form-group"
 >
   <label
-    className=""
     htmlFor="textInput8"
   >
     Favorite Color
@@ -336,7 +402,6 @@ exports[`Storyshots InputText minimal usage 1`] = `
   className="form-group"
 >
   <label
-    className=""
     htmlFor="textInput9"
   >
     First Name
@@ -363,7 +428,6 @@ exports[`Storyshots InputText validation 1`] = `
   className="form-group"
 >
   <label
-    className=""
     htmlFor="textInput10"
   >
     Username

package.json

@@ -37,10 +37,10 @@
     "babel-preset-env": "^1.4.0",
     "babel-preset-es2015": "^6.24.1",
     "babel-preset-react": "^6.24.1",
-    "coveralls": "^2.13.1",
-    "enzyme": "^2.8.2",
     "babili-webpack-plugin": "^0.1.1",
+    "coveralls": "^2.13.1",
     "css-loader": "^0.28.4",
+    "enzyme": "^2.8.2",
     "eslint": "^3.19.0",
     "eslint-config-airbnb": "^14.1.0",
     "eslint-config-edx": "^2.0.1",
@@ -48,6 +48,7 @@
     "eslint-plugin-jsx-a11y": "^4.0.0",
     "eslint-plugin-react": "^6.10.3",
     "husky": "^0.13.4",
+    "identity-obj-proxy": "^3.0.0",
     "jest": "^20.0.4",
     "node-sass": "^4.5.3",
     "postcss-scss": "^1.0.1",
@@ -58,5 +59,11 @@
     "style-loader": "^0.18.2",
     "webpack": "^2.4.1",
     "webpack-dev-server": "^2.4.4"
+  },
+  "jest": {
+    "moduleNameMapper": {
+      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
+      "\\.(css|scss)$": "identity-obj-proxy"
+    }
   }
 }

src/utils/asInput.jsx

 /* eslint-disable react/no-unused-prop-types */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { Label, FormGroup, FormFeedback, FormText } from 'reactstrap';
+import { FormGroup, FormFeedback, FormText } from 'reactstrap';
 
 import newId from './newId';
 
@@ -86,7 +86,7 @@ const asInput = (WrappedComponent) => {
 
       return (
         <FormGroup>
-          <Label for={this.state.id}>{this.props.label}</Label>
+          <label htmlFor={this.state.id}>{this.props.label}</label>
           <WrappedComponent
             {...this.props}
             {...this.state}