hyper-react 0.11.0 → 0.12.0

data/lib/react/top_level.rb

@@ -84,6 +84,7 @@ module React
   end
 
   def self.render_to_string(element)
+    %x{ console.error("Warning: `React.render_to_string` is deprecated in favor of `React::Server.render_to_string`."); }
     if !(`typeof ReactDOMServer === 'undefined'`)
       React::RenderingContext.build { `ReactDOMServer.renderToString(#{element.to_n})` } # v0.15+
     elsif !(`typeof React.renderToString === 'undefined'`)
@@ -94,6 +95,7 @@ module React
   end
 
   def self.render_to_static_markup(element)
+    %x{ console.error("Warning: `React.render_to_static_markup` is deprecated in favor of `React::Server.render_to_static_markup`."); }
     if !(`typeof ReactDOMServer === 'undefined'`)
       React::RenderingContext.build { `ReactDOMServer.renderToStaticMarkup(#{element.to_n})` } # v0.15+
     elsif !(`typeof React.renderToString === 'undefined'`)

data/lib/reactive-ruby/component_loader.rb

@@ -29,7 +29,8 @@ module ReactiveRuby
     private
 
     def components
-      # Make this configurable at some point
+      opts = ::Rails.configuration.react.server_renderer_options
+      return opts[:files].first.gsub(/.js$/,'') if opts && opts[:files]
       'components'
     end
 

data/lib/reactive-ruby/isomorphic_helpers.rb

@@ -1,3 +1,5 @@
+require "react/config"
+
 module React
   module IsomorphicHelpers
     def self.included(base)
@@ -28,6 +30,13 @@ module React
 
     def self.log(message, message_type = :info)
       message = [message] unless message.is_a? Array
+
+      is_production = React::Config.config[:environment] == 'production'
+
+      if (message_type == :info || message_type == :warning) && is_production
+        return
+      end
+
       if message_type == :info
         if on_opal_server?
           style = 'background: #00FFFF; color: red'
@@ -102,6 +111,7 @@ module React
           ctx["ServerSideIsomorphicMethods"] = self
           send_to_opal(:load_context, @unique_id, name)
         end
+        Hyperloop::Application::Boot.run(context: self)
         self.class.before_first_mount_blocks.each { |block| block.call(self) }
       end
 

data/lib/reactive-ruby/version.rb

@@ -1,3 +1,3 @@
 module React
-  VERSION = "0.11.0"
+  VERSION = "0.12.0"
 end

data/lib/reactrb/auto-import.rb

@@ -17,15 +17,10 @@ if RUBY_ENGINE == 'opal'
         React::NativeLibrary.import_const_from_native(Object, const_name, true) || raise(e)
       end
 
-      def method_missing(method_name, *args, &block)
-        method = method_name.gsub(/_as_node/, '') # remove once _as_node is deprecated.
+      def method_missing(method, *args, &block)
         component_class = React::NativeLibrary.import_const_from_native(self, method, false)
         _reactrb_original_method_missing(method, *args, &block) unless component_class
-        if method == method_name
-          React::RenderingContext.render(component_class, *args, &block)
-        else # remove once _as_node is deprecated.
-          React::RenderingContext.build_only(component_class, *args, &block)
-        end
+        React::RenderingContext.render(component_class, *args, &block)
       end
     end
   end

data/spec/react/callbacks_spec.rb

@@ -13,8 +13,9 @@ describe React::Callbacks do
       end
     end
 
-    expect_any_instance_of(Foo).to receive(:wash_hand)
-    Foo.new.run_callback(:before_dinner)
+    instance = Foo.new
+    expect(instance).to receive(:wash_hand)
+    instance.run_callback(:before_dinner)
   end
 
   it 'defines multiple callbacks' do
@@ -30,9 +31,10 @@ describe React::Callbacks do
       def turn_of_laptop;end
     end
 
-    expect_any_instance_of(Foo).to receive(:wash_hand)
-    expect_any_instance_of(Foo).to receive(:turn_of_laptop)
-    Foo.new.run_callback(:before_dinner)
+    instance = Foo.new
+    expect(instance).to receive(:wash_hand)
+    expect(instance).to receive(:turn_of_laptop)
+    instance.run_callback(:before_dinner)
   end
 
   it 'defines block callback' do
@@ -95,9 +97,8 @@ describe React::Callbacks do
       def eat_ice_cream(a,b,c);  end
     end
 
-    expect_any_instance_of(Foo).to receive(:eat_ice_cream).with(4,5,6)
-
     foo = Foo.new
+    expect(foo).to receive(:eat_ice_cream).with(4,5,6)
     foo.run_callback(:before_dinner, 1, 2)
     foo.run_callback(:after_dinner, 4, 5, 6)
     expect(foo.lorem).to eq('1-2')

data/spec/react/component_spec.rb

@@ -186,7 +186,7 @@ describe React::Component, type: :component do
         define_state :foo
         before_mount :set_up
         def set_up
-          self.foo = 'bar'
+          mutate.foo 'bar'
         end
       end
 
@@ -208,7 +208,7 @@ describe React::Component, type: :component do
         define_state(:foo) { 10 }
         before_mount :bump
         def bump
-          self.foo = self.foo + 20
+          mutate.foo(state.foo + 20)
         end
       end
 
@@ -221,8 +221,8 @@ describe React::Component, type: :component do
         define_state :foo, :foo2
         before_mount :set_up
         def set_up
-          self.foo = 10
-          self.foo2 = 20
+          mutate.foo 10
+          mutate.foo2 20
         end
       end
 
@@ -267,7 +267,7 @@ describe React::Component, type: :component do
       Foo.class_eval do
         define_state(:foo) { 10 }
         def render
-          React.create_element('div') { self.foo }
+          React.create_element('div') { state.foo }
         end
       end
 
@@ -289,12 +289,16 @@ describe React::Component, type: :component do
     it 'supports original `replaceState` as `set_state!` method' do
       Foo.class_eval do
         before_mount do
-          self.set_state(foo: 'bar')
-          self.set_state!(bar: 'lorem')
+          set_state(foo: 'bar')
+          set_state!(bar: 'lorem')
         end
       end
 
       element = renderToDocument(Foo)
+      puts "*************************************************************************************"
+      puts "element.state[:foo] = #{element.state[:foo]}"
+      puts "element.state[:bar] = #{element.state[:bar]}"
+      puts "*************************************************************************************"
       expect(element.state[:foo]).to be_nil
       expect(element.state[:bar]).to eq('lorem')
     end
@@ -318,11 +322,11 @@ describe React::Component, type: :component do
         define_state :foo
 
         before_mount do
-          self.foo = [{a: "Hello"}]
+          mutate.foo [{a: "Hello"}]
         end
 
         def render
-          div { self.foo[0][:a] }
+          div { state.foo[0][:a] }
         end
       end
 
@@ -567,7 +571,7 @@ describe React::Component, type: :component do
 
         def render
           React.create_element('div').on(:click) do
-            self.clicked = true
+            mutate.clicked true
           end
         end
       end
@@ -580,10 +584,15 @@ describe React::Component, type: :component do
 
     it 'invokes handler on `this.props` using emit' do
       Foo.class_eval do
+        param :_onFooSubmit, type: Proc
         after_mount :setup
 
         def setup
+          puts "***************************** about to emit******************************"
           self.emit(:foo_submit, 'bar')
+          puts "***************************** emitted!!! ********************************"
+        rescue Exception => e
+          puts "FAILED FAILED FAILED #{e}"
         end
 
         def render
@@ -599,6 +608,7 @@ describe React::Component, type: :component do
 
     it 'invokes handler with multiple params using emit' do
       Foo.class_eval do
+        param :_onFooInvoked, type: Proc
         after_mount :setup
 
         def setup
@@ -712,15 +722,16 @@ describe React::Component, type: :component do
         include React::Component
 
         def render
-          p(class_name: 'foo') do
+          div {
+            p(class_name: 'foo')
             p
             div { 'lorem ipsum' }
             p(id: '10')
-          end
+          }
         end
       end
 
-      markup = '<p class="foo"><p></p><div>lorem ipsum</div><p id="10"></p></p>'
+      markup = '<div><p class="foo"></p><p></p><div>lorem ipsum</div><p id="10"></p></div>'
       expect(Foo).to render_static_html(markup)
     end
 

data/spec/react/dsl_spec.rb

@@ -65,7 +65,7 @@ describe 'the React DSL', type: :component do
       end
     end
 
-    expect(React.render_to_static_markup(React.create_element(Foo))).to match(/<input data-foo="12"(\/)?>/)
+    expect(React::Server.render_to_static_markup(React.create_element(Foo))).to match(/<input data-foo="12"(\/)?>/)
   end
 
   it "will turn the last string in a block into a element" do
@@ -101,7 +101,7 @@ describe 'the React DSL', type: :component do
       end
     end
 
-    expect(React.render_to_static_markup(React.create_element(Foo)).gsub("<br/>", "<br>")).to eq('<div><span>hello<br></span></div>')
+    expect(React::Server.render_to_static_markup(React.create_element(Foo)).gsub("<br/>", "<br>")).to eq('<div><span>hello<br></span></div>')
   end
 
   it "has a .td short hand String method" do
@@ -109,11 +109,15 @@ describe 'the React DSL', type: :component do
     Foo.class_eval do
       include React::Component
       def render
-        table { tr { "hello".td } }
+        table {
+          tbody {
+            tr { "hello".td }
+          }
+        }
       end
     end
 
-    expect(Foo).to render_static_html('<table><tr><td>hello</td></tr></table>')
+    expect(Foo).to render_static_html('<table><tbody><tr><td>hello</td></tr></tbody></table>')
   end
 
   it "has a .para short hand String method" do
@@ -156,7 +160,7 @@ describe 'the React DSL', type: :component do
         Comp()
       end
     end
-    expect { React.render_to_static_markup(React.create_element(Mod::NestedMod::NestedComp)) }
+    expect { React::Server.render_to_static_markup(React.create_element(Mod::NestedMod::NestedComp)) }
       .to raise_error('Comp does not appear to be a react component.')
   end
 
@@ -168,7 +172,7 @@ describe 'the React DSL', type: :component do
         _undefined_method
       end
     end
-    expect { React.render_to_static_markup(React.create_element(Foo)) }
+    expect { React::Server.render_to_static_markup(React.create_element(Foo)) }
       .to raise_error(NoMethodError)
   end
 
@@ -251,12 +255,12 @@ describe 'the React DSL', type: :component do
     Foo.class_eval do
       include React::Component
       def render
-        div(data: { foo: :bar }, aria: { foo_bar: :foo })
+        div(data: { foo: :bar }, aria: { label: "title" })
       end
     end
 
     expect(Foo)
-      .to render_static_html('<div data-foo="bar" aria-foo-bar="foo"></div>')
+      .to render_static_html('<div data-foo="bar" aria-label="title"></div>')
   end
 
   it 'should not convert a hash param to hyphenated html attributes if not in React::HASH_ATTRIBUTES' do

data/spec/react/element_spec.rb

@@ -29,7 +29,7 @@ describe React::Element, type: :component do
         end
       end
 
-      expect(React.render_to_static_markup(React.create_element(Foo))).to match(/<input (type="text" value=""|value="" type="text")(\/)?>/)
+      expect(React::Server.render_to_static_markup(React.create_element(Foo))).to match(/<input (type="text" value=""|value="" type="text")(\/)?>/)
     end
   end
 
@@ -43,7 +43,7 @@ describe React::Element, type: :component do
           params.on_event
         end
       end
-      expect(React.render_to_static_markup(React.create_element(Foo).on(:event) {'works!'})).to eq('<span>works!</span>')
+      expect(React::Server.render_to_static_markup(React.create_element(Foo).on(:event) {'works!'})).to eq('<span>works!</span>')
     end
 
     it 'will subscribe to multiple component event params' do
@@ -55,7 +55,7 @@ describe React::Element, type: :component do
           params.on_event1+params.on_event2
         end
       end
-      expect(React.render_to_static_markup(React.create_element(Foo).on(:event1, :event2) {'works!'})).to eq('<span>works!works!</span>')
+      expect(React::Server.render_to_static_markup(React.create_element(Foo).on(:event1, :event2) {'works!'})).to eq('<span>works!works!</span>')
     end
 
     it 'will subscribe to a native components event param' do
@@ -71,7 +71,7 @@ describe React::Element, type: :component do
       Foo.class_eval do
         imports "NativeComponent"
       end
-      expect(React.render_to_static_markup(React.create_element(Foo).on(:event) {'works!'})).to eq('<span>works!</span>')
+      expect(React::Server.render_to_static_markup(React.create_element(Foo).on(:event) {'works!'})).to eq('<span>works!</span>')
     end
 
     it 'will subscribe to a component event param with a non-default name' do
@@ -82,7 +82,7 @@ describe React::Element, type: :component do
           params.my_event
         end
       end
-      expect(React.render_to_static_markup(React.create_element(Foo).on("<my_event>") {'works!'})).to eq('<span>works!</span>')
+      expect(React::Server.render_to_static_markup(React.create_element(Foo).on("<my_event>") {'works!'})).to eq('<span>works!</span>')
     end
 
     it 'will subscribe to a component event param using the deprecated naming convention and generate a message' do
@@ -99,10 +99,10 @@ describe React::Element, type: :component do
         var org_error_console = window.console.error;
         window.console.warn = window.console.error = function(str){log.push(str)}
       }
-      expect(React.render_to_static_markup(React.create_element(Foo).on(:event) {'works!'})).to eq('<span>works!</span>')
+      expect(React::Server.render_to_static_markup(React.create_element(Foo).on(:event) {'works!'})).to eq('<span>works!</span>')
       `window.console.warn = org_warn_console; window.console.error = org_error_console;`
       expect(`log[0]`).to match(/Warning: Failed prop( type|Type): In component `Foo`\nProvided prop `on_event` not specified in spec/)
-      expect(`log[1]`).to eq("Warning: Deprecated feature used in React::Component. In future releases React::Element#on('event') will no longer respond to the '_onEvent' emitter.\nRename your emitter param to 'on_event' or use .on('<_onEvent>')")
+      expect(`log[1]`).to eq("Warning: Deprecated feature used in Foo. In future releases React::Element#on('event') will no longer respond to the '_onEvent' emitter.\nRename your emitter param to 'on_event' or use .on('<_onEvent>')")
     end
   end
 

data/spec/react/native_library_spec.rb

@@ -205,6 +205,28 @@ describe "React::NativeLibrary", type: :component do
     end.to raise_error(/^Foo cannot import \'window\.Baz\'\: (?!does not appear to be a native react component)..*$/)
   end
 
+  it "allows passing native object as props" do
+    %x{
+      window.NativeComponent = React.createClass({
+        displayName: "HelloMessage",
+        render: function render() {
+          return React.createElement("div", null, "Hello ", this.props.user.name);
+        }
+      })
+    }
+    stub_const 'Foo', Class.new(React::Component::Base)
+    Foo.class_eval do
+      imports "NativeComponent"
+    end
+    stub_const 'Wrapper', Class.new(React::Component::Base)
+    Wrapper.class_eval do
+      def render
+        Foo(user: `{name: 'David'}`)
+      end
+    end
+    expect(Wrapper).to render_static_html('<div>Hello David</div>')
+  end
+
   context "automatic importing" do
 
     it "will automatically import a React.js component when referenced in another component" do
@@ -216,7 +238,7 @@ describe "React::NativeLibrary", type: :component do
           }
         })
       }
-      expect(React.render_to_static_markup(
+      expect(React::Server.render_to_static_markup(
         React.create_element(NativeLibraryTestModule::Component, time_stamp: Time.now))).to match(/<div>Hello There.*<\/div>/)
     end
 
@@ -236,46 +258,6 @@ describe "React::NativeLibrary", type: :component do
       expect(Foo).to render_static_html('<div>Hello There</div>')
     end
 
-    it 'will automatically import a React.js component when referenced in another component with the _as_node suffix' do
-      stub_const 'Foo', Class.new(React::Component::Base)
-      Foo.class_eval do
-        render(:div) do
-          e = React::Element.new(NativeComponent_as_node(name: 'There'))
-          2.times { e.render }
-        end
-      end
-      %x{
-        window.NativeComponent = React.createClass({
-          displayName: "HelloMessage",
-          render: function render() {
-            return React.createElement("div", null, "Hello ", this.props.name);
-          }
-        })
-      }
-      expect(Foo).to render_static_html('<div><div>Hello There</div><div>Hello There</div></div>')
-    end
-
-    it "will automatically import a React.js component in a library when referenced in another component with the _as_node suffix" do
-      stub_const 'Foo', Class.new(React::Component::Base)
-      Foo.class_eval do
-        render(:div) do
-          e = React::Element.new(NativeLibrary::NativeComponent_as_node(name: 'There'))
-          2.times { e.render }
-        end
-      end
-      %x{
-        window.NativeLibrary = {
-          NativeComponent: React.createClass({
-            displayName: "HelloMessage",
-            render: function render() {
-              return React.createElement("div", null, "Hello ", this.props.name);
-            }
-          })
-        }
-      }
-      expect(Foo).to render_static_html('<div><div>Hello There</div><div>Hello There</div></div>')
-    end
-
     it "will automatically import a React.js component when referenced as a constant" do
       %x{
         window.NativeComponent = React.createClass({
@@ -303,7 +285,7 @@ describe "React::NativeLibrary", type: :component do
         }
       }
 
-      expect(React.render_to_static_markup(
+      expect(React::Server.render_to_static_markup(
         React.create_element(NativeLibraryTestModule::NestedComponent, time_stamp: Time.now))).to match(/<div>Hello There.*<\/div>/)
     end
 
@@ -330,7 +312,7 @@ describe "React::NativeLibrary", type: :component do
         }
       }
       expect do
-        React.render_to_static_markup(React.create_element(NativeLibraryTestModule::NestedComponent, time_stamp: Time.now))
+        React::Server.render_to_static_markup(React.create_element(NativeLibraryTestModule::NestedComponent, time_stamp: Time.now))
       end.to raise_error("could not import a react component named: NativeLibrary.NativeNestedLibrary.NativeComponent")
 
     end