Add ability to render custom attributes from the controller

 Currently, all custom attributes are sliced from options when using the controller renderer, instead of forwarding it to the view helper, making it impossible to set a custom class name or id.

 This patch changes the behaviour to allow class, id, custom data-* and aria-* attributes.

Author: Kai Wood

lib/react/rails/controller_renderer.rb

@@ -12,7 +12,7 @@ def initialize(options={})
 
   def call(name, options, &block)
     props = options.fetch(:props, {})
-    options = options.slice(:data, :tag).merge(prerender: true)
+    options = options.slice(:data, :aria, :tag, :class, :id).merge(prerender: true)
     react_component(name, props, options, &block)
   end
 end

test/dummy/app/controllers/server_controller.rb

@@ -16,6 +16,11 @@ def console_example_suppressed
   end
 
   def inline_component
-    render component: 'TodoList', props: { todos: ['Render this inline'] }, tag: 'span'
+    render component: 'TodoList',
+           props: { todos: ['Render this inline'] },
+           tag: 'span',
+           class: 'custom-class',
+           id: 'custom-id',
+           data: { remote: true }
   end
 end

test/server_rendered_html_test.rb

@@ -55,11 +55,15 @@ def wait_to_ensure_asset_pipeline_detects_changes
   test 'react inline component rendering' do
     get '/server/inline_component'
     rendered_html = response.body
-    assert_match(/<span data-react-class=\"TodoList\"/, rendered_html)
+    assert_match(/<span.*data-react-class=\"TodoList\"/, rendered_html)
     # make sure that the items are prerendered
     assert_match(/Render this inline/, rendered_html)
     assert_match(/<\/ul><\/span>/, rendered_html, "it accepts a tag override")
     # make sure that the layout is rendered with the component
     assert_match(/<title>Dummy<\/title>/, rendered_html)
+    # make sure that custom html attributes are rendered
+    assert_match(/class=\"custom-class\"/, rendered_html)
+    assert_match(/id=\"custom-id\"/, rendered_html)
+    assert_match(/data-remote=\"true\"/, rendered_html)
   end
 end