Add sample React component and test

README.md

@@ -1,3 +1,3 @@
 # React Testing example
 
-Bare-bones Rails for demonstrating testing React components as shown in ...
+Minimal Rails app for demonstrating testing React components as shown in [http://calebwoods.com/2015/11/01/testing-react-components-rails/](http://calebwoods.com/2015/11/01/testing-react-components-rails/)

Rakefile

@@ -4,3 +4,5 @@
 require File.expand_path('../config/application', __FILE__)
 
 Rails.application.load_tasks
+
+task :default => [ 'spec:javascripts' ]

app/assets/javascripts/components/checkbox_with_label.js.jsx

@@ -0,0 +1,21 @@
+var CheckboxWithLabel = React.createClass({
+
+  getInitialState: function () {
+    return { isChecked: false }
+  },
+  onChange: function () {
+    this.setState({isChecked: !this.state.isChecked});
+  },
+  render: function () {
+    return (
+      <label>
+        <input
+          type="checkbox"
+          checked={this.state.isChecked}
+          onChange={this.onChange}
+        />
+        {this.state.isChecked ? this.props.labelOn : this.props.labelOff}
+      </label>
+    );
+  }
+});

config/application.rb

@@ -28,5 +28,6 @@ class Application < Rails::Application
     # The default locale is :en and all translations from config/locales/*.rb,yml are auto loaded.
     # config.i18n.load_path += Dir[Rails.root.join('my', 'locales', '*.{rb,yml}').to_s]
     # config.i18n.default_locale = :de
+    config.react.addons = true
   end
 end

spec/javascripts/components/checkbox_with_label_spec.js

@@ -0,0 +1,23 @@
+var TestUtils = React.addons.TestUtils
+
+describe('CheckboxWithLabel', function () {
+
+  it('changes the text after click', function () {
+    var element = React.createElement(CheckboxWithLabel, { labelOn: 'On', labelOff: 'Off' });
+
+    // Render a checkbox with label in the document
+    var checkbox = TestUtils.renderIntoDocument(element);
+
+    var checkboxNode = ReactDOM.findDOMNode(checkbox);
+
+    // Verify that it's Off by default
+    expect(checkboxNode.textContent).toEqual('Off');
+
+    // Simulate a click and verify that it is now On
+    TestUtils.Simulate.change(
+      TestUtils.findRenderedDOMComponentWithTag(checkbox, 'input')
+    );
+    expect(checkboxNode.textContent).toEqual('On');
+  });
+
+});

spec/javascripts/support/jasmine.yml

@@ -0,0 +1,52 @@
+# path to parent directory of src_files
+# relative path from Rails.root
+# defaults to app/assets/javascripts
+src_dir: "app/assets/javascripts"
+
+# path to additional directory of source file that are not part of assets pipeline and need to be included
+# relative path from Rails.root
+# defaults to []
+# include_dir:
+#   - ../mobile_app/public/js
+
+# path to parent directory of css_files
+# relative path from Rails.root
+# defaults to app/assets/stylesheets
+css_dir: "app/assets/stylesheets"
+
+# list of file expressions to include as source files
+# relative path from src_dir
+src_files:
+  - "application.{js.coffee,js,coffee}"
+
+# list of file expressions to include as css files
+# relative path from css_dir
+css_files:
+
+# path to parent directory of spec_files
+# relative path from Rails.root
+#
+# Alternatively accept an array of directory to include external spec files
+# spec_dir:
+#   - spec/javascripts
+#   - ../engine/spec/javascripts
+#
+# defaults to spec/javascripts
+spec_dir: spec/javascripts
+
+# list of file expressions to include as helpers into spec runner
+# relative path from spec_dir
+helpers:
+  - "helpers/**/*.{js.coffee,js,coffee}"
+
+# list of file expressions to include as specs into spec runner
+# relative path from spec_dir
+spec_files:
+  - "**/*[Ss]pec.{js.coffee,js,coffee}"
+
+# path to directory of temporary files
+# (spec runner and asset cache)
+# defaults to tmp/jasmine
+tmp_dir: "tmp/jasmine"
+
+use_phantom_gem: false