reactjs · leticiawanderley · Jun 24, 2016 · Jun 24, 2016 · Jun 24, 2016 · Jun 24, 2016
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,6 @@
+{
+    "presets": [
+        "react",
+        "es2015"
+    ]
+}
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,4 @@
 *~
 node_modules
 .DS_Store
+.idea/
diff --git a/LICENSE b/LICENSE
diff --git a/README.md b/README.md
@@ -53,3 +53,9 @@ You can change the port number by setting the `$PORT` environment variable befor
 ```sh
 PORT=3001 node server.js
 ```
+
+## Testing
+
+```sh
+npm test
+```
diff --git a/__tests__/example-test.js b/__tests__/example-test.js
@@ -0,0 +1,34 @@
+jest.unmock('../public/scripts/example.js');
+
+var React = require('react');
+var ReactDOM = require('react-dom');
+var ReactTestUtils = require('react-addons-test-utils');
+var CommentBoxComponent = require('../public/scripts/example.js');
+
+var CommentBox = CommentBoxComponent.CommentBox;
+
+describe('TestCommentBoxComponent', () => {
+  var boxNode;
+  var commentBox;
+  beforeEach(() => {
+    commentBox = ReactTestUtils.renderIntoDocument(
+      <CommentBox url="/api/comments" pollInterval={2000} />
+    );
+    boxNode = ReactDOM.findDOMNode(commentBox);
+  });
+
+  it('should exists', function() {
+    expect(ReactTestUtils.isCompositeComponent(commentBox)).toBeTruthy();
+  });
+
+  it('class should equal commentBox', () => {
+    expect(boxNode.className).toEqual('commentBox');
+  });
+
+  it('initial state data should be empty', () => {
+    expect(commentBox.getInitialState()).toBeDefined();
+    const commentBoxData = commentBox.getInitialState().data;
+    expect(commentBoxData).toBeDefined();
+    expect(commentBoxData).toEqual([]);
+  })
+})
diff --git a/app.json b/app.json
diff --git a/comments.json b/comments.json
@@ -23,5 +23,15 @@
         "id": 1464988717637,
         "author": "evil",
         "text": "<a href=\"javascript:alert(1)\">alert(1)</a>"
+    },
+    {
+        "id": 1491409415686,
+        "author": "blah",
+        "text": "blah"
+    },
+    {
+        "id": 1491409439269,
+        "author": "testing",
+        "text": "test"
     }
 ]
diff --git a/package.json b/package.json
@@ -6,14 +6,41 @@
   "description": "Code from the React tutorial.",
   "main": "server.js",
   "dependencies": {
+    "babel-jest": "^13.0.0",
+    "babel-preset-es2015": "^6.9.0",
+    "babel-preset-react": "^6.5.0",
     "body-parser": "^1.4.3",
-    "express": "^4.4.5"
+    "express": "^4.4.5",
+    "jest-cli": "^13.0.0",
+    "jquery": "^3.2.1",
+    "react": "^15.1.0",
+    "react-addons-test-utils": "^15.4.2",
+    "react-dom": "^15.1.0"
+  },
+  "devDependencies": {
+    "babel-preset-react": "^6.5.0",
+    "babelify": "^7.3.0",
+    "jest-cli": "^13.0.0"
   },
-  "devDependencies": {},
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "jest",
     "start": "node server.js"
   },
+  "jest": {
+    "scriptPreprocessor": "./node_modules/babel-jest",
+    "testFileExtensions": [
+      "es6",
+      "js"
+    ],
+    "moduleFileExtensions": [
+      "js",
+      "json",
+      "es6"
+    ],
+    "unmockedModulePathPatterns": [
+      "./node_modules/react"
+    ]
+  },
   "repository": {
     "type": "git",
     "url": "https://github.com/reactjs/react-tutorial.git"
@@ -29,7 +56,7 @@
     "url": "https://github.com/reactjs/react-tutorial/issues"
   },
   "homepage": "https://github.com/reactjs/react-tutorial",
-  "engines" : {
-    "node" : "0.12.x"
+  "engines": {
+    "node": "0.12.x"
   }
 }
diff --git a/public/css/base.css b/public/css/base.css
diff --git a/public/index.html b/public/index.html
@@ -13,10 +13,11 @@
   </head>
   <body>
     <div id="content"></div>
-    <script type="text/babel" src="scripts/example.js"></script>
+    <!-- browserify -t [ babelify --presets [ react ] ] render.js -o bundle.js -->
+    <script src="scripts/bundle.js"></script>
     <script type="text/babel">
       // To get started with this tutorial running your own code, simply remove
-      // the script tag loading scripts/example.js and start writing code here.
+      // the script tag loading scripts/bundle.js and start writing code here.
     </script>
   </body>
 </html>
diff --git a/public/scripts/bundle.js b/public/scripts/bundle.js
diff --git a/public/scripts/example.js b/public/scripts/example.js
@@ -9,6 +9,8 @@
  * ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
  * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  */
+var React = require('react');
+var $ = require('jquery');
 
 var Comment = React.createClass({
   rawMarkup: function() {
@@ -141,7 +143,6 @@ var CommentForm = React.createClass({
   }
 });
 
-ReactDOM.render(
-  <CommentBox url="/api/comments" pollInterval={2000} />,
-  document.getElementById('content')
-);
+module.exports = {
+  CommentBox: CommentBox
+}
diff --git a/public/scripts/render.js b/public/scripts/render.js
@@ -0,0 +1,6 @@
+var CommentBox = require('./example.js').CommentBox;
+
+ReactDOM.render(
+  <CommentBox url="/api/comments" pollInterval={2000} />,
+  document.getElementById('content')
+);
diff --git a/react.js b/react.js
diff --git a/requirements.txt b/requirements.txt
diff --git a/server.go b/server.go
diff --git a/server.js b/server.js
diff --git a/server.php b/server.php
diff --git a/server.pl b/server.pl
diff --git a/server.py b/server.py
diff --git a/server.rb b/server.rb