added merging of data and aria hashes in #114, removed #269 for performance reasons

Author: catmando

lib/react/api.rb

@@ -203,6 +203,8 @@ def self.convert_props(args)
                 raise "The style param must be a Hash"
               end
               properties['style'] = (properties['style'] || {}).merge(value)
+            elsif React::HASH_ATTRIBUTES.include?(key) && value.is_a?(Hash)
+              properties[key] = (properties[key] || {}).merge(value)
             else
               properties[key] = value
             end
@@ -234,7 +236,7 @@ def self.convert_props(args)
                           }
                         }
         elsif React::HASH_ATTRIBUTES.include?(key) && value.is_a?(Hash)
-          value.each { |k, v| props["#{key}-#{k.tr('_', '-')}"] = v.to_n }
+          value.each { |k, v| props["#{key}-#{k.gsub(/__|_/, '__' => '_', '_' => '-')}"] = v.to_n }
         else
           props[React.html_attr?(lower_camelize(key)) ? lower_camelize(key) : key] = value
         end

lib/react/component/tags.rb

@@ -20,10 +20,18 @@ def present(component, *params, &children)
         React::RenderingContext.render(component, *params, &children)
       end
 
-      # define each predefined tag (downcase) as an instance method (deprecated) and as a component (upcase)
+      # define each predefined tag (upcase) as an instance method and a constant
+      # deprecated: define each predefined tag (downcase) as the alias of the instance method
+
       HTML_TAGS.each do |tag|
 
-        # deprecated - remove
+        define_method(tag.upcase) do |*params, &children|
+          React::RenderingContext.render(tag, *params, &children)
+        end
+
+        const_set tag.upcase, tag
+
+        # deprecated: remove
         if tag == 'p'
           define_method(tag) do |*params, &children|
             if children || params.count == 0 || (params.count == 1 && params.first.is_a?(Hash))
@@ -33,29 +41,12 @@ def present(component, *params, &children)
             end
           end
         else
-          define_method(tag) do |*params, &children|
-            React::RenderingContext.render(tag, *params, &children)
-          end
-        end
-
-        # new style: allows custom hooks to be added and/or the render method to
-        # be modified.  i.e. see how hyper-mesh deals with defaultValues in input tags
-
-        klass = Class.new(Hyperloop::Component) do
-          # its complicated but the automatic inclusion of the Mixin is setup after all
-          # the files are loaded, so at this point we have to manually load it.
-          include Hyperloop::Component::Mixin
-          collect_other_params_as :opts
-          # we simply pass along all the params and children with the tag string name
-          render { React::RenderingContext.render(tag, params.opts, &children) }
-
-          # after_error do |error, info|
-          #   raise error
-          # end
+          alias_method tag, tag.upcase
         end
-        const_set(tag.upcase, klass)
+        # end of deprecated code
       end
 
+      # this is used for haml style (i.e. DIV.foo.bar) class tags which is deprecated
       def self.html_tag_class_for(tag)
         downcased_tag = tag.downcase
         if tag =~ /[A-Z]+/ && HTML_TAGS.include?(downcased_tag)

spec/react/builtin_tags_spec.rb

@@ -1,12 +1,15 @@
 require 'spec_helper'
 
-describe 'Builtin Tags', js: true do
-  it "built in tags render method can be redefined" do
+describe 'redefining builtin tags', js: true do
+  it "built in tags can be redefined" do
     mount 'Foo' do
+      React::Component::Tags.remove_method :DIV
+      React::Component::Tags.send(:remove_const, :DIV)
       class React::Component::Tags::DIV < Hyperloop::Component
+        others :opts
         render do
           params.opts['data-render-time'] = Time.now
-          present "div", params.opts, &children
+          present :div, params.opts, data: {render_time:  Time.now}, &children
         end
       end
       class Foo < Hyperloop::Component
@@ -17,22 +20,4 @@ class Foo < Hyperloop::Component
     end
     expect(Time.parse(find('#tp')['data-render-time'])).to be <= Time.now
   end
-
-  it "built in tags other callbacks can be added" do
-    mount 'Foo' do
-      class React::Component::Tags::DIV < Hyperloop::Component
-        def add_time
-          params.opts['data-render-time'] = Time.now
-        end
-        before_mount :add_time
-        before_update :add_time
-      end
-      class Foo < Hyperloop::Component
-        render(DIV, id: :tp) do
-          "hello"
-        end
-      end
-    end
-    expect(Time.parse(find('#tp')['data-render-time'])).to be <= Time.now
-  end
 end

spec/react/component_spec.rb

@@ -132,7 +132,7 @@ def render
         end
       end
       expect_evaluate_ruby('Foo.get_error').to eq('ErrorFoo Error')
-      expect_evaluate_ruby('Foo.get_info').to eq("\n    in ErrorFoo\n    in div\n    in React::Component::Tags::DIV\n    in Foo\n    in React::TopLevelRailsComponent")
+      expect_evaluate_ruby('Foo.get_info').to eq("\n    in ErrorFoo\n    in div\n    in Foo\n    in React::TopLevelRailsComponent")
     end
   end
 

spec/react/param_declaration_spec.rb

@@ -186,14 +186,14 @@ def render
     it 'allows passing and merging complex arguments to params' do
       mount 'Tester' do
         class TakesParams < Hyperloop::Component
-          param :flag
-          param :a
-          param :b
-          param :c
-          param :d
+          param  :flag
+          param  :a
+          param  :b
+          param  :c
+          param  :d
           others :opts
           render do
-            DIV(params.opts, id: :tp, class: "another-class", style: {marginLeft: 12}) do
+            DIV(params.opts, id: :tp, class: "another-class", style: {marginLeft: 12}, data: {foo: :hi}) do
               "flag: #{params.flag}, a: #{params.a}, b: #{params.b}, c: #{params.c}, d: #{params.d}"
             end
           end
@@ -202,7 +202,7 @@ class Tester < Hyperloop::Component
           render do
             TakesParams(
               :flag,
-              {a: 1, b: 2, class: [:x, :y], className: 'foo', class_name: 'bar baz', style: {marginRight: 12}},
+              {a: 1, b: 2, class: [:x, :y], className: 'foo', class_name: 'bar baz', style: {marginRight: 12}, data: {bar: :there}},
               c: 3, d: 4
             )
           end
@@ -212,6 +212,8 @@ class Tester < Hyperloop::Component
       expect(tp[:class].split).to contain_exactly("x", "y", "foo", "bar", "baz", "another-class")
       expect(tp[:style]).to match('margin-right: 12px')
       expect(tp[:style]).to match('margin-left: 12px')
+      expect(tp['data-foo']).to eq("hi")
+      expect(tp['data-bar']).to eq("there")
       expect(tp).to have_content('flag: true, a: 1, b: 2, c: 3, d: 4')
     end