Merge pull request #31 from github/non-instance-syntax

Use render(MyComponent, foo: :bar) syntax

Author: joelhawksley

CHANGELOG.md

@@ -1,7 +1,25 @@
-*   Components now inherit from ActionView::Component::base
+*   The `render_component` test helper has been renamed to `render_inline`. `render_component` has been deprecated and will be removed in v2.0.0.
 
     *Joel Hawksley*
 
+*   Components are now rendered with `render MyComponent, foo: :bar` syntax. The existing `render MyComponent.new(foo: :bar)` syntax has been deprecated and will be removed in v2.0.0.
+
+    *Joel Hawksley*
+
+# v1.1.0
+
+*   Components now inherit from ActionView::Component::Base
+
+    *Joel Hawksley*
+
+# v1.0.1
+
 *   Always recompile component templates outside production.
 
     *Joel Hawksley, John Hawthorn*
+
+# v1.0.0
+
+This release extracts the `ActionView::Component` library from the GitHub application.
+
+It will be published on RubyGems under the existing `actionview-component` gem name, as @chancancode has passed us ownership of the gem.

Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    actionview-component (1.0.1)
+    actionview-component (1.1.0)
 
 GEM
   remote: https://rubygems.org/

README.md

@@ -124,7 +124,7 @@ end
 We can render it in a view as:
 
 ```erb
-<%= render(TestComponent.new(title: "my title")) do %>
+<%= render(TestComponent, title: "my title") do %>
   Hello, World!
 <% end %>
 ```
@@ -135,12 +135,24 @@ Which returns:
 <span title="my title">Hello, World!</span>
 ```
 
+##### Supported `render` syntaxes
+
+Components can be rendered via:
+
+`render(TestComponent, foo: :bar)`
+
+`render(component: TestComponent, locals: { foo: :bar })`
+
+The following syntax has been deprecated and will be removed in v2.0.0:
+
+`render(TestComponent.new(foo: :bar)`
+
 #### Error case
 
 If the component is rendered with a blank title:
 
 ```erb
-<%= render(TestComponent.new(title: "")) do %>
+<%= render(TestComponent, title: "") do %>
   Hello, World!
 <% end %>
 ```
@@ -151,7 +163,7 @@ An error will be raised:
 
 ### Testing
 
-Components are unit tested directly. The `render_component` test helper renders a component and wraps the result in `Nokogiri.HTML`, allowing us to test the component above as:
+Components are unit tested directly. The `render_inline` test helper wraps the result in `Nokogiri.HTML`, allowing us to test the component above as:
 
 ```ruby
 require "action_view/component/test_helpers"
@@ -162,7 +174,7 @@ class MyComponentTest < Minitest::Test
   def test_render_component
     assert_equal(
       %(<span title="my title">Hello, World!</span>),
-      render_component(TestComponent.new(title: "my title")) { "Hello, World!" }.css("span").to_html
+      render_inline(TestComponent, title: "my title") { "Hello, World!" }.css("span").to_html
     )
   end
 end

lib/action_view/component/base.rb

@@ -2,18 +2,28 @@
 
 # Monkey patch ActionView::Base#render to support ActionView::Component
 #
-# Upstreamed in https://github.com/rails/rails/pull/36388
-# Necessary for Rails versions < 6.1.0.alpha
+# A version of this monkey patch was upstreamed in https://github.com/rails/rails/pull/36388
+# We'll need to upstream an updated version of this eventually.
 class ActionView::Base
   module RenderMonkeyPatch
-    def render(component, _ = nil, &block)
-      return super unless component.respond_to?(:render_in)
-
-      component.render_in(self, &block)
+    def render(options = {}, args = {}, &block)
+      if options.respond_to?(:render_in)
+        ActiveSupport::Deprecation.warn(
+          "passing component instances to `render` has been deprecated and will be removed in v2.0.0. Use `render MyComponent, foo: :bar` instead."
+        )
+
+        options.render_in(self, &block)
+      elsif options.is_a?(Class) && options < ActionView::Component::Base
+        options.new(args).render_in(self, &block)
+      elsif options.is_a?(Hash) && options.has_key?(:component)
+        options[:component].new(options[:locals]).render_in(self, &block)
+      else
+        super
+      end
     end
   end
 
-  prepend RenderMonkeyPatch unless Rails::VERSION::MINOR > 0 && Rails::VERSION::MAJOR == 6
+  prepend RenderMonkeyPatch
 end
 
 module ActionView
@@ -42,7 +52,7 @@ class Base < ActionView::Base
       # <span title="<%= @title %>">Hello, <%= content %>!</span>
       #
       # In use:
-      # <%= render MyComponent.new(title: "greeting") do %>world<% end %>
+      # <%= render MyComponent, title: "greeting" do %>world<% end %>
       # returns:
       # <span title="greeting">Hello, world!</span>
       #

lib/action_view/component/test_helpers.rb

@@ -3,8 +3,16 @@
 module ActionView
   module Component
     module TestHelpers
-      def render_component(component, &block)
-        Nokogiri::HTML(component.render_in(ApplicationController.new.view_context, &block))
+      def render_inline(component, **args, &block)
+        Nokogiri::HTML(ApplicationController.new.view_context.render(component, args, &block))
+      end
+
+      def render_component(component, **args, &block)
+        ActiveSupport::Deprecation.warn(
+          "`render_component` has been deprecated in favor of `render_inline`, and will be removed in v2.0.0."
+        )
+
+        render_inline(component, args, &block)
       end
     end
   end

test/action_view/component_test.rb

@@ -6,100 +6,120 @@ class ActionView::ComponentTest < Minitest::Test
   include ActionView::Component::TestHelpers
 
   def test_render_component
-    result = render_component(MyComponent.new)
+    result = render_inline(MyComponent)
+
+    assert_equal trim_result(result.css("div").first.to_html), "<div>hello,world!</div>"
+  end
+
+  def test_render_component_with_old_helper
+    result = render_component(MyComponent)
 
     assert_equal trim_result(result.css("div").first.to_html), "<div>hello,world!</div>"
   end
 
   def test_raises_error_when_sidecar_template_is_missing
     exception = assert_raises NotImplementedError do
-      render_component(MissingTemplateComponent.new)
+      render_inline(MissingTemplateComponent)
     end
 
     assert_includes exception.message, "Could not find a template file for MissingTemplateComponent"
   end
 
   def test_raises_error_when_more_then_one_sidecar_template_is_present
     error = assert_raises StandardError do
-      render_component(TooManySidecarFilesComponent.new)
+      render_inline(TooManySidecarFilesComponent)
     end
 
     assert_includes error.message, "More than one template found for TooManySidecarFilesComponent."
   end
 
   def test_raises_error_when_initializer_is_not_defined
     exception = assert_raises NotImplementedError do
-      render_component(MissingInitializerComponent.new)
+      render_inline(MissingInitializerComponent)
     end
 
     assert_includes exception.message, "must implement #initialize"
   end
 
   def test_checks_validations
     exception = assert_raises ActiveModel::ValidationError do
-      render_component(WrapperComponent.new)
+      render_inline(WrapperComponent)
     end
 
     assert_includes exception.message, "Content can't be blank"
   end
 
   def test_renders_content_from_block
-    result = render_component(WrapperComponent.new) do
+    result = render_inline(WrapperComponent) do
       "content"
     end
 
     assert_equal trim_result(result.css("span").first.to_html), "<span>content</span>"
   end
 
   def test_renders_slim_template
-    result = render_component(SlimComponent.new(message: "bar")) { "foo" }
+    result = render_inline(SlimComponent, message: "bar") { "foo" }
 
     assert_includes result.text, "foo"
     assert_includes result.text, "bar"
   end
 
   def test_renders_haml_template
-    result = render_component(HamlComponent.new(message: "bar")) { "foo" }
+    result = render_inline(HamlComponent, message: "bar") { "foo" }
 
     assert_includes result.text, "foo"
     assert_includes result.text, "bar"
   end
 
   def test_renders_erb_template
-    result = render_component(ErbComponent.new(message: "bar")) { "foo" }
+    result = render_inline(ErbComponent, message: "bar") { "foo" }
+
+    assert_includes result.text, "foo"
+    assert_includes result.text, "bar"
+  end
+
+  def test_renders_erb_template_with_old_syntax
+    result = render_inline(ErbComponent.new(message: "bar")) { "foo" }
+
+    assert_includes result.text, "foo"
+    assert_includes result.text, "bar"
+  end
+
+  def test_renders_erb_template_with_hash_syntax
+    result = render_inline(component: ErbComponent, locals: { message: "bar" }) { "foo" }
 
     assert_includes result.text, "foo"
     assert_includes result.text, "bar"
   end
 
   def test_renders_route_helper
-    result = render_component(RouteComponent.new)
+    result = render_inline(RouteComponent)
 
     assert_includes result.text, "/"
   end
 
   def test_template_changes_are_not_reflected_in_production
     ActionView::Base.cache_template_loading = true
 
-    assert_equal "<div>hello,world!</div>", render_component(MyComponent.new).css("div").first.to_html
+    assert_equal "<div>hello,world!</div>", render_inline(MyComponent).css("div").first.to_html
 
     modify_file "app/components/my_component.html.erb", "<div>Goodbye world!</div>" do
-      assert_equal  "<div>hello,world!</div>", render_component(MyComponent.new).css("div").first.to_html
+      assert_equal  "<div>hello,world!</div>", render_inline(MyComponent).css("div").first.to_html
     end
 
-    assert_equal "<div>hello,world!</div>", render_component(MyComponent.new).css("div").first.to_html
+    assert_equal "<div>hello,world!</div>", render_inline(MyComponent).css("div").first.to_html
   end
 
   def test_template_changes_are_reflected_outside_production
     ActionView::Base.cache_template_loading = false
 
-    assert_equal "<div>hello,world!</div>", render_component(MyComponent.new).css("div").first.to_html
+    assert_equal "<div>hello,world!</div>", render_inline(MyComponent).css("div").first.to_html
 
     modify_file "app/components/my_component.html.erb", "<div>Goodbye world!</div>" do
-      assert_equal "<div>Goodbye world!</div>", render_component(MyComponent.new).css("div").first.to_html
+      assert_equal "<div>Goodbye world!</div>", render_inline(MyComponent).css("div").first.to_html
     end
 
-    assert_equal "<div>hello,world!</div>", render_component(MyComponent.new).css("div").first.to_html
+    assert_equal "<div>hello,world!</div>", render_inline(MyComponent).css("div").first.to_html
   end
 
   private

test/action_view/integration_test.rb

@@ -8,4 +8,16 @@ class IntegrationTest < ActionDispatch::IntegrationTest
     assert_response :success
     assert_equal trim_result(response.body), "<span><div>Foobar</div></span>"
   end
+
+  test "rendering component in a view with component: syntax" do
+    get "/component"
+    assert_response :success
+    assert_equal trim_result(response.body), "<span><div>Foobar</div></span>"
+  end
+
+  test "rendering component in a view with deprecated syntax" do
+    get "/deprecated"
+    assert_response :success
+    assert_equal trim_result(response.body), "<span><div>Foobar</div></span>"
+  end
 end

test/app/controllers/application_controller.rb

@@ -1,6 +1,4 @@
 # frozen_string_literal: true
 
 class ApplicationController < ActionController::Base
-  def index
-  end
 end

test/app/views/application/component.html.erb

@@ -0,0 +1 @@
+<span><%= render component: ErbComponent, locals: { message: "bar" } do %>Foo<% end %></span>

test/app/views/application/deprecated.html.erb

@@ -0,0 +1 @@
+<span><%= render ErbComponent.new(message: "bar") do %>Foo<% end %></span>