create some tests

Author: mathieudutour

example/index.html

@@ -38,7 +38,7 @@
 
   <div id="app"></div>
 
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.12.0/react.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.0/react.js"></script>
   <script src="../react-search-input.js"></script>
   <script>
     var App = React.createClass({

package.json

@@ -6,7 +6,16 @@
   "dependencies": {
     "react": "^0.12.0"
   },
-  "scripts": {},
+  "devDependencies": {
+    "jsdom": "^3.0.2",
+    "coveralls": "^2.11.2",
+    "mocha": "^2.1.0",
+    "istanbul": "^0.3.5"
+  },
+  "scripts": {
+    "test": "mocha",
+    "coverage": "./node_modules/istanbul/lib/cli.js cover --print detail ./node_modules/mocha/bin/_mocha -- --ui bdd -R spec"
+  },
   "repository": {
     "type": "git",
     "url": "https://github.com/enki-com/react-search-input"

react-search-input.js

@@ -35,7 +35,7 @@
     },
 
     updateSearch: function(e) {
-      var searchTerm = e.currentTarget.value.toLowerCase();
+      var searchTerm = e.target.value.toLowerCase();
       this.setState({
         searchTerm: searchTerm
       }, function() {

test/index.js

@@ -0,0 +1,94 @@
+global.document = require("jsdom").jsdom("");
+global.window = document.parentWindow;
+global.navigator = window.navigator;
+
+var assert = require("assert");
+
+var React = require("react/addons")
+  , TestUtils = React.addons.TestUtils;
+
+var SearchInput = require("../react-search-input");
+
+
+var randomString = function () {
+  return Math.random().toString(36).substring(7);
+};
+
+var TestComponent = React.createClass({
+
+  getInitialState: function () {
+    return { searchTerm: '' }
+  }
+
+  , searchInput: function () {
+    return this.refs.search;
+  }
+
+  , getSearchTerm: function () {
+    return this.state.searchTerm;
+  }
+
+  , searchUpdated: function(term) {
+    this.setState({searchTerm: term}); // needed to force re-render
+  }
+
+  , render: function () {
+    return React.createElement(SearchInput, React.__spread({}, {
+      ref: "search"
+      , onChange: this.searchUpdated
+    }, this.props));
+  }
+});
+
+describe("SearchInput", function () {
+  var createSearchInput = function (props) {
+    var component = TestUtils.renderIntoDocument(React.createElement(TestComponent, props));
+    return component;
+  };
+
+  var changeSearchTerm = function (searchInput, term, blur) {
+    var input = TestUtils.findRenderedDOMComponentWithTag(searchInput, "input");
+
+
+    TestUtils.Simulate.click(input);
+    TestUtils.Simulate.change(input, { target: { value: term } });
+
+    return input;
+  };
+
+  describe("basic", function () {
+    it("should change search term", function () {
+      var container = createSearchInput();
+      var searchinput = container.searchInput();
+      var term = randomString();
+
+      changeSearchTerm(searchinput, term);
+
+      var searchTerm = searchinput.state.searchTerm;
+
+      assert.equal(searchTerm, term, "the search term should have been changed");
+    });
+
+    it("should change call the props onChange", function () {
+      var container = createSearchInput();
+      var searchinput = container.searchInput();
+      var term = randomString();
+
+      changeSearchTerm(searchinput, term);
+
+      var searchTerm = container.getSearchTerm();
+
+      assert.equal(searchTerm, term, "the search term should have been changed");
+    });
+  });
+
+  describe("props", function () {
+    it("should test className", function () {
+      var searchInput = createSearchInput({
+        className: "test"
+      }).searchInput();
+
+      assert.equal(searchInput.getDOMNode().className, "search-input test", "there should be a new class");
+    });
+  });
+});