reactive-ruby 0.7.3

data/spec/element_spec.rb

@@ -0,0 +1,60 @@
+require "spec_helper"
+
+describe React::Element do
+  it "should bridge `type` of native React.Element attributes" do
+    element = React.create_element('div')
+    expect(element.element_type).to eq("div")
+  end
+
+  async "should be renderable" do
+    element = React.create_element('span')
+    div = `document.createElement("div")`
+    React.render(element, div) do
+      run_async {
+        expect(`div.children[0].tagName`).to eq("SPAN")
+      }
+    end
+  end
+
+  describe "Event subscription" do
+    it "should be subscribable through `on(:event_name)` method" do
+      expect { |b|
+        element = React.create_element("div").on(:click, &b)
+        instance = renderElementToDocument(element)
+        simulateEvent(:click, instance)
+      }.to yield_with_args(React::Event)
+
+      expect { |b|
+        element = React.create_element("div").on(:key_down, &b)
+        instance = renderElementToDocument(element)
+        simulateEvent(:keyDown, instance, {key: "Enter"})
+      }.to yield_control
+
+      expect { |b|
+        element = React.create_element("form").on(:submit, &b)
+        instance = renderElementToDocument(element)
+        simulateEvent(:submit, instance, {})
+      }.to yield_control
+    end
+
+    it "should return self for `on` method" do
+      element = React.create_element("div")
+      expect(element.on(:click){}).to eq(element)
+    end
+  end
+
+  describe "Children" do
+    it "should return a Enumerable" do
+      ele = React.create_element('div') { [React.create_element('a'), React.create_element('li')] }
+      nodes = ele.children.map {|ele| ele.element_type }
+      expect(nodes).to eq(["a", "li"])
+    end
+
+    it "should return a Enumerator when not providing a block" do
+      ele = React.create_element('div') { [React.create_element('a'), React.create_element('li')] }
+      nodes = ele.children.each
+      expect(nodes).to be_a(Enumerator)
+      expect(nodes.size).to eq(2)
+    end
+  end
+end

data/spec/event_spec.rb

@@ -0,0 +1,22 @@
+require "spec_helper"
+
+describe React::Event do
+  it "should bridge attributes of native SyntheticEvent (see http://facebook.github.io/react/docs/events.html#syntheticevent)" do
+    element = React.create_element('div').on(:click) do |event|
+      expect(event.bubbles).to eq(`#{event.to_n}.bubbles`)
+      expect(event.cancelable).to eq(`#{event.to_n}.cancelable`)
+      expect(event.current_target).to eq(`#{event.to_n}.currentTarget`)
+      expect(event.default_prevented).to eq(`#{event.to_n}.defaultPrevented`)
+      expect(event.event_phase).to eq(`#{event.to_n}.eventPhase`)
+      expect(event.is_trusted?).to eq(`#{event.to_n}.isTrusted`)
+      expect(event.native_event).to eq(`#{event.to_n}.nativeEvent`)
+      expect(event.target).to eq(`#{event.to_n}.target`)
+      expect(event.timestamp).to eq(`#{event.to_n}.timeStamp`)
+      expect(event.event_type).to eq(`#{event.to_n}.type`)
+      expect(event).to respond_to(:prevent_default)
+      expect(event).to respond_to(:stop_propagation)
+    end
+    instance = renderElementToDocument(element)
+    simulateEvent(:click, instance)
+  end
+end

data/spec/react_spec.rb

@@ -0,0 +1,209 @@
+require "spec_helper"
+
+describe React do
+  after(:each) do
+    React::API.clear_component_class_cache
+  end
+
+  describe "is_valid_element" do
+    it "should return true if passed a valid element" do
+      element = React::Element.new(`React.createElement('div')`)
+      expect(React.is_valid_element(element)).to eq(true)
+    end
+
+    it "should return false is passed a non React element" do
+      element = React::Element.new(`{}`)
+      expect(React.is_valid_element(element)).to eq(false)
+    end
+  end
+
+  describe "create_element" do
+    it "should create a valid element with only tag" do
+      element = React.create_element('div')
+      expect(React.is_valid_element(element)).to eq(true)
+    end
+
+    context "with block" do
+      it "should create a valid element with text as only child when block yield String" do
+        element = React.create_element('div') { "lorem ipsum" }
+        expect(React.is_valid_element(element)).to eq(true)
+        expect(element.props.children).to eq("lorem ipsum")
+      end
+
+      it "should create a valid element with children as array when block yield Array of element" do
+        element = React.create_element('div') do
+          [React.create_element('span'), React.create_element('span'), React.create_element('span')]
+        end
+        expect(React.is_valid_element(element)).to eq(true)
+        expect(element.props.children.length).to eq(3)
+      end
+
+      it "should render element with children as array when block yield Array of element" do
+        element = React.create_element('div') do
+          [React.create_element('span'), React.create_element('span'), React.create_element('span')]
+        end
+        instance = renderElementToDocument(element)
+        expect(instance.getDOMNode.childNodes.length).to eq(3)
+      end
+    end
+    describe "custom element" do
+      before do
+        stub_const 'Foo', Class.new
+        Foo.class_eval do
+          def render
+            React.create_element("div") { "lorem" }
+          end
+        end
+      end
+
+      it "should render element with only one children correctly" do
+        element = React.create_element(Foo) { React.create_element('span') }
+        instance = renderElementToDocument(element)
+        expect(instance.props.children).not_to be_a(Array)
+        expect(instance.props.children.type).to eq("span")
+      end
+
+      it "should render element with more than one children correctly" do
+        element = React.create_element(Foo) { [React.create_element('span'), React.create_element('span')] }
+        instance = renderElementToDocument(element)
+        expect(instance.props.children).to be_a(Array)
+        expect(instance.props.children.length).to eq(2)
+      end
+
+      it "should create a valid element provided class defined `render`" do
+        element = React.create_element(Foo)
+        expect(React.is_valid_element(element)).to eq(true)
+      end
+
+      it "should allow creating with properties" do
+        element = React.create_element(Foo, foo: "bar")
+        expect(element.props.foo).to eq("bar")
+      end
+
+      it "should raise error if provided class doesn't defined `render`" do
+        expect { React.create_element(Array) }.to raise_error
+      end
+
+      it "should use the same instance for the same ReactComponent" do
+        Foo.class_eval do
+          attr_accessor :a
+          def initialize(n)
+            self.a = 10
+          end
+
+          def component_will_mount
+            self.a = 20
+          end
+
+          def render
+            React.create_element("div") { self.a.to_s }
+          end
+        end
+
+        expect(React.render_to_static_markup(React.create_element(Foo))).to eq("<div>20</div>")
+      end
+
+      it "should match the instance cycle to ReactComponent life cycle" do
+        `var count = 0;`
+
+        Foo.class_eval do
+          def initialize
+            `count = count + 1;`
+          end
+          def render
+            React.create_element("div")
+          end
+        end
+
+        renderToDocument(Foo)
+        renderToDocument(Foo)
+
+        expect(`count`).to eq(2)
+      end
+    end
+
+    describe "create element with properties" do
+      it "should enforce snake-cased property name" do
+        element = React.create_element("div", class_name: "foo")
+        expect(element.props.className).to eq("foo")
+      end
+
+      it "should allow custom property" do
+        element = React.create_element("div", foo: "bar")
+        expect(element.props.foo).to eq("bar")
+      end
+
+      it "should not camel-case custom property" do
+        element = React.create_element("div", foo_bar: "foo")
+        expect(element.props.foo_bar).to eq("foo")
+      end
+    end
+
+    describe "class_name helpers (React.addons.classSet)" do
+      it "should transform Hash provided to `class_name` props as string" do
+        classes = {foo: true, bar: false, lorem: true}
+        element = React.create_element("div", class_name: classes)
+
+        expect(element.props.className).to eq("foo lorem")
+      end
+
+      it "should not alter behavior when passing a string" do
+        element = React.create_element("div", class_name: "foo bar")
+
+        expect(element.props.className).to eq("foo bar")
+      end
+    end
+  end
+
+
+  describe "render" do
+    async "should render element to DOM" do
+      div = `document.createElement("div")`
+      React.render(React.create_element('span') { "lorem" }, div) do
+        run_async {
+          expect(`div.children[0].tagName`).to eq("SPAN")
+          expect(`div.textContent`).to eq("lorem")
+        }
+      end
+    end
+
+    it "should work without providing a block" do
+      div = `document.createElement("div")`
+      React.render(React.create_element('span') { "lorem" }, div)
+    end
+
+    it "should return a React::Component::API compatible object" do
+      div = `document.createElement("div")`
+      component = React.render(React.create_element('span') { "lorem" }, div)
+      React::Component::API.public_instance_methods(true).each do |method_name|
+        expect(component).to respond_to(method_name)
+      end
+    end
+
+    pending "should return nil to prevent abstraction leakage" do
+      div = `document.createElement("div")`
+      expect {
+        React.render(React.create_element('span') { "lorem" }, div)
+      }.to be_nil
+    end
+  end
+
+  describe "render_to_string" do
+    it "should render a React.Element to string" do
+      ele = React.create_element('span') { "lorem" }
+      expect(React.render_to_string(ele)).to be_kind_of(String)
+    end
+  end
+
+  describe "unmount_component_at_node" do
+    async "should unmount component at node" do
+      div = `document.createElement("div")`
+      React.render(React.create_element('span') { "lorem" }, div ) do
+        run_async {
+          expect(React.unmount_component_at_node(div)).to eq(true)
+        }
+      end
+    end
+  end
+
+end

data/spec/reactjs/index.html.erb

@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html>
+<head>
+</head>
+<body>
+  <%= javascript_include_tag 'react-with-addons' %>
+  <%= javascript_include_tag @server.main %>
+  <div id="placeholder" style="display: none"></div>
+  <div id="render_here"></div>
+</body>
+</html>

data/spec/spec_helper.rb

@@ -0,0 +1,29 @@
+require 'react'
+
+module ReactTestHelpers
+  `var ReactTestUtils = React.addons.TestUtils`
+
+  def renderToDocument(type, options = {})
+    element = React.create_element(type, options)
+    return renderElementToDocument(element)
+  end
+
+  def renderElementToDocument(element)
+    instance = Native(`ReactTestUtils.renderIntoDocument(#{element.to_n})`)
+    instance.class.include(React::Component::API)
+    return instance
+  end
+
+  def simulateEvent(event, element, params = {})
+    simulator = Native(`ReactTestUtils.Simulate`)
+    simulator[event.to_s].call(`#{element.to_n}.getDOMNode()`, params)
+  end
+
+  def isElementOfType(element, type)
+    `React.addons.TestUtils.isElementOfType(#{element.to_n}, #{type.cached_component_class})`
+  end
+end
+
+RSpec.configure do |config|
+  config.include ReactTestHelpers
+end

data/spec/tutorial/tutorial_spec.rb

@@ -0,0 +1,37 @@
+require "spec_helper"
+  
+class HelloMessage
+  include React::Component
+  def render
+    div { "Hello World!" }
+  end
+end
+  
+describe "An Example from the react.rb doc" do
+  
+  it "produces the correct result" do
+    expect(React.render_to_static_markup(React.create_element(HelloMessage))).to eq('<div>Hello World!</div>')
+  end
+  
+end
+
+class HelloMessage2
+  include React::Component
+  define_state(:user_name) { '@catmando' }
+  def render
+    div { "Hello #{user_name}" }
+  end
+end
+
+describe "Adding state to a component (second tutorial example)" do
+  
+  it "produces the correct result" do
+    expect(React.render_to_static_markup(React.create_element(HelloMessage2))).to eq('<div>Hello @catmando</div>')
+  end
+  
+  it "renders to the document" do
+    React.render(React.create_element(HelloMessage2), `document.getElementById('render_here')`)
+    expect(`document.getElementById('render_here').innerHTML`) =~ 'Hello @catmando'
+  end
+  
+end

data/spec/validator_spec.rb

@@ -0,0 +1,79 @@
+require "spec_helper"
+
+describe React::Validator do
+  describe "validate" do
+    describe "Presence validation" do
+      it "should check if required props provided" do
+        validator = React::Validator.build do
+          requires :foo
+          requires :bar
+        end
+
+        expect(validator.validate({})).to eq(["Required prop `foo` was not specified", "Required prop `bar` was not specified"])
+        expect(validator.validate({foo: 1, bar: 3})).to eq([])
+      end
+
+      it "should check if passed non specified prop" do
+        validator = React::Validator.build do
+          optional :foo
+        end
+
+        expect(validator.validate({bar: 10})).to eq(["Provided prop `bar` not specified in spec"])
+        expect(validator.validate({foo: 10})).to eq([])
+      end
+    end
+
+    describe "Type validation" do
+      it "should check if passed value with wrong type" do
+        validator = React::Validator.build do
+          requires :foo, type: String
+        end
+
+        expect(validator.validate({foo: 10})).to eq(["Provided prop `foo` was not the specified type `String`"])
+        expect(validator.validate({foo: "10"})).to eq([])
+      end
+
+      it "should check if passed value with wrong custom type" do
+        stub_const 'Bar', Class.new
+        validator = React::Validator.build do
+          requires :foo, type: Bar
+        end
+
+        expect(validator.validate({foo: 10})).to eq(["Provided prop `foo` was not the specified type `Bar`"])
+        expect(validator.validate({foo: Bar.new})).to eq([])
+      end
+
+      it "should support Array[Class] validation" do
+        validator = React::Validator.build do
+          requires :foo, type: Array[Hash]
+        end
+
+        expect(validator.validate({foo: [1,'2',3]})).to eq(["Provided prop `foo` was not an Array of the specified type `Hash`"])
+        expect(validator.validate({foo: [{},{},{}]})).to eq([])
+      end
+    end
+
+    describe "Limited values" do
+      it "should check if passed value is not one of the specified values" do
+        validator = React::Validator.build do
+          requires :foo, values: [4,5,6]
+        end
+
+        expect(validator.validate({foo: 3})).to eq(["Value `3` for prop `foo` is not an allowed value"])
+        expect(validator.validate({foo: 4})).to eq([])
+      end
+    end
+  end
+
+  describe "default_props" do
+    it "should return specified default values" do
+      validator = React::Validator.build do
+        requires :foo, default: 10
+        requires :bar
+        optional :lorem, default: 20
+      end
+
+      expect(validator.default_props).to eq({foo: 10, lorem: 20})
+    end
+  end
+end