From 1b02bab88992174bbec6ce22e9d210ff339227e0 Mon Sep 17 00:00:00 2001 From: Nicholas Smith <69756853+ncsmith24@users.noreply.github.com> Date: Fri, 13 May 2022 17:53:24 -0400 Subject: [PATCH 1/8] Add Mission Met to the list of companies that use ViewComponent (#1360) * Add Mission Met to the list of companies that use ViewComponent * Update CHANGELOG.md * Update docs/CHANGELOG.md Co-authored-by: Hans Lemuet Co-authored-by: Joel Hawksley Co-authored-by: Hans Lemuet --- docs/CHANGELOG.md | 4 ++++ docs/index.md | 1 + 2 files changed, 5 insertions(+) diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 50d87c052..891119b7e 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -9,6 +9,10 @@ title: Changelog ## main +* Add Mission Met to list of companies that use ViewComponent. + + *Nick Smith* + ## 2.55.0 * Add `render_parent` convenience method to avoid confusion between `<%= super %>` and `<% super %>` in template code. diff --git a/docs/index.md b/docs/index.md index e78a61066..916da8764 100644 --- a/docs/index.md +++ b/docs/index.md @@ -205,6 +205,7 @@ ViewComponent is built by over a hundred members of the community, including: * [Framework](https://frame.work/) * [GitHub](https://github.com/) (900+ components used 15k+ times) * [Litmus](https://litmus.engineering/) +* [Mission Met Center](https://www.missionmet.com/mission-met-center) * [Orbit](https://orbit.love) * [Podia](https://www.podia.com/) * [QuickNode](https://www.quicknode.com/) From fe484aadde5948b5b05ef44fdccdec817e5c612c Mon Sep 17 00:00:00 2001 From: Drew Bragg Date: Thu, 19 May 2022 02:57:35 -0700 Subject: [PATCH 2/8] Add Within3 to list of companies using VC (#1364) --- docs/CHANGELOG.md | 4 ++++ docs/index.md | 1 + 2 files changed, 5 insertions(+) diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 891119b7e..928fa52cf 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -9,6 +9,10 @@ title: Changelog ## main +* Add Within3 to list of companies that use ViewComponent. + + *Drew Bragg* + * Add Mission Met to list of companies that use ViewComponent. *Nick Smith* diff --git a/docs/index.md b/docs/index.md index 916da8764..6a5da5b34 100644 --- a/docs/index.md +++ b/docs/index.md @@ -211,6 +211,7 @@ ViewComponent is built by over a hundred members of the community, including: * [QuickNode](https://www.quicknode.com/) * [Shogun](https://getshogun.com/) * [Wecasa](https://www.wecasa.fr/) +* [Within3](https://www.within3.com/) * [Wrapbook](https://wrapbook.com/) Using ViewComponent? [Send a pull request](https://github.com/github/view_component/edit/main/docs/index.md) to update this list! From efca9314cbd2ac6809010ffaa9612ff6bf94fb99 Mon Sep 17 00:00:00 2001 From: JWShuff Date: Tue, 24 May 2022 07:28:09 -0700 Subject: [PATCH 3/8] Add g2 to ViewComponent Users (#1366) * Add g2 to ViewComponent Users * Update docs/CHANGELOG.md Co-authored-by: Joel Hawksley --- docs/CHANGELOG.md | 4 ++++ docs/index.md | 2 ++ 2 files changed, 6 insertions(+) diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 928fa52cf..49323e625 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -9,6 +9,10 @@ title: Changelog ## main +* Add G2 to list of companies that use ViewComponent. + + *Jack Shuff* + * Add Within3 to list of companies that use ViewComponent. *Drew Bragg* diff --git a/docs/index.md b/docs/index.md index 6a5da5b34..336b9a0d1 100644 --- a/docs/index.md +++ b/docs/index.md @@ -151,6 +151,7 @@ ViewComponent is built by over a hundred members of the community, including: jonspalmer juanmanuelramallo jules2689 +jwshuff kaspermeyer kylefox leighhalliday @@ -203,6 +204,7 @@ ViewComponent is built by over a hundred members of the community, including: * [Cometeer](https://cometeer.com/) * [Cults.](https://cults3d.com/) * [Framework](https://frame.work/) +* [G2](https://www.g2.com/) (200+ components) * [GitHub](https://github.com/) (900+ components used 15k+ times) * [Litmus](https://litmus.engineering/) * [Mission Met Center](https://www.missionmet.com/mission-met-center) From 18b6899e207ec90d9700162b6477021483e8f235 Mon Sep 17 00:00:00 2001 From: Joel Hawksley Date: Thu, 26 May 2022 15:52:11 -0600 Subject: [PATCH 4/8] Move tests into sandbox directory (#1368) * Move tests into sandbox directory In working on https://github.com/github/view_component/pull/1347/, @camertron and I realized that it's a little strange to have our test suite in two places. In the interest of having our suite serve as an example for consumers of the framework, we decided to move everything into the sandbox application. * use more specific name for test --- docs/CHANGELOG.md | 4 ++++ .../test}/action_view_compatibility_test.rb | 0 test/{view_component => sandbox/test}/base_test.rb | 0 test/{view_component => sandbox/test}/better_html_test.rb | 0 test/{view_component => sandbox/test}/collection_test.rb | 0 .../test}/default_preview_layout_integration_test.rb | 0 .../{ => sandbox/test}/generators/component_generator_test.rb | 0 test/{ => sandbox/test}/generators/erb_generator_test.rb | 0 test/{ => sandbox/test}/generators/haml_generator_test.rb | 0 test/{ => sandbox/test}/generators/locale_generator_test.rb | 0 test/{ => sandbox/test}/generators/preview_generator_test.rb | 0 test/{ => sandbox/test}/generators/slim_generator_test.rb | 0 test/{ => sandbox/test}/generators/stimulus_generator_test.rb | 0 .../test}/generators/tailwindcss_generator_test.rb | 0 .../{ => sandbox/test}/generators/test_unit_generator_test.rb | 0 test/{view_component => sandbox/test}/instrumentation_test.rb | 0 test/{view_component => sandbox/test}/integration_test.rb | 0 test/{view_component => sandbox/test}/layouts_test.rb | 0 test/{view_component => sandbox/test}/mailer_test.rb | 0 test/{view_component => sandbox/test}/preview_helper_test.rb | 0 .../view_component_test.rb => sandbox/test/rendering_test.rb} | 0 test/{view_component => sandbox/test}/slotable_test.rb | 0 test/{view_component => sandbox/test}/slotable_v2_test.rb | 0 test/{view_component => sandbox/test}/tasks_test.rb | 0 test/{view_component => sandbox/test}/translatable_test.rb | 0 25 files changed, 4 insertions(+) rename test/{view_component => sandbox/test}/action_view_compatibility_test.rb (100%) rename test/{view_component => sandbox/test}/base_test.rb (100%) rename test/{view_component => sandbox/test}/better_html_test.rb (100%) rename test/{view_component => sandbox/test}/collection_test.rb (100%) rename test/{view_component => sandbox/test}/default_preview_layout_integration_test.rb (100%) rename test/{ => sandbox/test}/generators/component_generator_test.rb (100%) rename test/{ => sandbox/test}/generators/erb_generator_test.rb (100%) rename test/{ => sandbox/test}/generators/haml_generator_test.rb (100%) rename test/{ => sandbox/test}/generators/locale_generator_test.rb (100%) rename test/{ => sandbox/test}/generators/preview_generator_test.rb (100%) rename test/{ => sandbox/test}/generators/slim_generator_test.rb (100%) rename test/{ => sandbox/test}/generators/stimulus_generator_test.rb (100%) rename test/{ => sandbox/test}/generators/tailwindcss_generator_test.rb (100%) rename test/{ => sandbox/test}/generators/test_unit_generator_test.rb (100%) rename test/{view_component => sandbox/test}/instrumentation_test.rb (100%) rename test/{view_component => sandbox/test}/integration_test.rb (100%) rename test/{view_component => sandbox/test}/layouts_test.rb (100%) rename test/{view_component => sandbox/test}/mailer_test.rb (100%) rename test/{view_component => sandbox/test}/preview_helper_test.rb (100%) rename test/{view_component/view_component_test.rb => sandbox/test/rendering_test.rb} (100%) rename test/{view_component => sandbox/test}/slotable_test.rb (100%) rename test/{view_component => sandbox/test}/slotable_v2_test.rb (100%) rename test/{view_component => sandbox/test}/tasks_test.rb (100%) rename test/{view_component => sandbox/test}/translatable_test.rb (100%) diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 49323e625..42ba0e798 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -9,6 +9,10 @@ title: Changelog ## main +* Move framework tests into sandbox application. + + *Joel Hawksley* + * Add G2 to list of companies that use ViewComponent. *Jack Shuff* diff --git a/test/view_component/action_view_compatibility_test.rb b/test/sandbox/test/action_view_compatibility_test.rb similarity index 100% rename from test/view_component/action_view_compatibility_test.rb rename to test/sandbox/test/action_view_compatibility_test.rb diff --git a/test/view_component/base_test.rb b/test/sandbox/test/base_test.rb similarity index 100% rename from test/view_component/base_test.rb rename to test/sandbox/test/base_test.rb diff --git a/test/view_component/better_html_test.rb b/test/sandbox/test/better_html_test.rb similarity index 100% rename from test/view_component/better_html_test.rb rename to test/sandbox/test/better_html_test.rb diff --git a/test/view_component/collection_test.rb b/test/sandbox/test/collection_test.rb similarity index 100% rename from test/view_component/collection_test.rb rename to test/sandbox/test/collection_test.rb diff --git a/test/view_component/default_preview_layout_integration_test.rb b/test/sandbox/test/default_preview_layout_integration_test.rb similarity index 100% rename from test/view_component/default_preview_layout_integration_test.rb rename to test/sandbox/test/default_preview_layout_integration_test.rb diff --git a/test/generators/component_generator_test.rb b/test/sandbox/test/generators/component_generator_test.rb similarity index 100% rename from test/generators/component_generator_test.rb rename to test/sandbox/test/generators/component_generator_test.rb diff --git a/test/generators/erb_generator_test.rb b/test/sandbox/test/generators/erb_generator_test.rb similarity index 100% rename from test/generators/erb_generator_test.rb rename to test/sandbox/test/generators/erb_generator_test.rb diff --git a/test/generators/haml_generator_test.rb b/test/sandbox/test/generators/haml_generator_test.rb similarity index 100% rename from test/generators/haml_generator_test.rb rename to test/sandbox/test/generators/haml_generator_test.rb diff --git a/test/generators/locale_generator_test.rb b/test/sandbox/test/generators/locale_generator_test.rb similarity index 100% rename from test/generators/locale_generator_test.rb rename to test/sandbox/test/generators/locale_generator_test.rb diff --git a/test/generators/preview_generator_test.rb b/test/sandbox/test/generators/preview_generator_test.rb similarity index 100% rename from test/generators/preview_generator_test.rb rename to test/sandbox/test/generators/preview_generator_test.rb diff --git a/test/generators/slim_generator_test.rb b/test/sandbox/test/generators/slim_generator_test.rb similarity index 100% rename from test/generators/slim_generator_test.rb rename to test/sandbox/test/generators/slim_generator_test.rb diff --git a/test/generators/stimulus_generator_test.rb b/test/sandbox/test/generators/stimulus_generator_test.rb similarity index 100% rename from test/generators/stimulus_generator_test.rb rename to test/sandbox/test/generators/stimulus_generator_test.rb diff --git a/test/generators/tailwindcss_generator_test.rb b/test/sandbox/test/generators/tailwindcss_generator_test.rb similarity index 100% rename from test/generators/tailwindcss_generator_test.rb rename to test/sandbox/test/generators/tailwindcss_generator_test.rb diff --git a/test/generators/test_unit_generator_test.rb b/test/sandbox/test/generators/test_unit_generator_test.rb similarity index 100% rename from test/generators/test_unit_generator_test.rb rename to test/sandbox/test/generators/test_unit_generator_test.rb diff --git a/test/view_component/instrumentation_test.rb b/test/sandbox/test/instrumentation_test.rb similarity index 100% rename from test/view_component/instrumentation_test.rb rename to test/sandbox/test/instrumentation_test.rb diff --git a/test/view_component/integration_test.rb b/test/sandbox/test/integration_test.rb similarity index 100% rename from test/view_component/integration_test.rb rename to test/sandbox/test/integration_test.rb diff --git a/test/view_component/layouts_test.rb b/test/sandbox/test/layouts_test.rb similarity index 100% rename from test/view_component/layouts_test.rb rename to test/sandbox/test/layouts_test.rb diff --git a/test/view_component/mailer_test.rb b/test/sandbox/test/mailer_test.rb similarity index 100% rename from test/view_component/mailer_test.rb rename to test/sandbox/test/mailer_test.rb diff --git a/test/view_component/preview_helper_test.rb b/test/sandbox/test/preview_helper_test.rb similarity index 100% rename from test/view_component/preview_helper_test.rb rename to test/sandbox/test/preview_helper_test.rb diff --git a/test/view_component/view_component_test.rb b/test/sandbox/test/rendering_test.rb similarity index 100% rename from test/view_component/view_component_test.rb rename to test/sandbox/test/rendering_test.rb diff --git a/test/view_component/slotable_test.rb b/test/sandbox/test/slotable_test.rb similarity index 100% rename from test/view_component/slotable_test.rb rename to test/sandbox/test/slotable_test.rb diff --git a/test/view_component/slotable_v2_test.rb b/test/sandbox/test/slotable_v2_test.rb similarity index 100% rename from test/view_component/slotable_v2_test.rb rename to test/sandbox/test/slotable_v2_test.rb diff --git a/test/view_component/tasks_test.rb b/test/sandbox/test/tasks_test.rb similarity index 100% rename from test/view_component/tasks_test.rb rename to test/sandbox/test/tasks_test.rb diff --git a/test/view_component/translatable_test.rb b/test/sandbox/test/translatable_test.rb similarity index 100% rename from test/view_component/translatable_test.rb rename to test/sandbox/test/translatable_test.rb From cd9b4ce597a19822d31ed678ab26d38761fa2c9d Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 27 May 2022 12:39:31 -0600 Subject: [PATCH 5/8] Bump rack from 2.2.3 to 2.2.3.1 (#1369) Bumps [rack](https://github.com/rack/rack) from 2.2.3 to 2.2.3.1. - [Release notes](https://github.com/rack/rack/releases) - [Changelog](https://github.com/rack/rack/blob/main/CHANGELOG.md) - [Commits](https://github.com/rack/rack/compare/2.2.3...2.2.3.1) --- updated-dependencies: - dependency-name: rack dependency-type: indirect ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- Gemfile.lock | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Gemfile.lock b/Gemfile.lock index 09fbfa320..9c94ed2eb 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -162,7 +162,7 @@ GEM method_source (~> 1.0) public_suffix (4.0.7) racc (1.6.0) - rack (2.2.3) + rack (2.2.3.1) rack-test (1.1.0) rack (>= 1.0, < 3) rails (7.0.3) From 2273e01c130d3fafa9bb8d88ade2dcc149028ec9 Mon Sep 17 00:00:00 2001 From: Richard Marbach <7984618+richardmarbach@users.noreply.github.com> Date: Tue, 31 May 2022 16:58:26 +0200 Subject: [PATCH 6/8] Test helper `#with_request_url` parses nested query parameters (#1370) --- docs/CHANGELOG.md | 4 ++++ docs/index.md | 1 + lib/view_component/test_helpers.rb | 2 +- test/sandbox/test/rendering_test.rb | 4 ++++ 4 files changed, 10 insertions(+), 1 deletion(-) diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 42ba0e798..842c688b0 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -25,6 +25,10 @@ title: Changelog *Nick Smith* +* Fix `#with_request_url` test helper not parsing nested query parameters into nested hashes. + + *Richard Marbach* + ## 2.55.0 * Add `render_parent` convenience method to avoid confusion between `<%= super %>` and `<% super %>` in template code. diff --git a/docs/index.md b/docs/index.md index 336b9a0d1..545f8d3dd 100644 --- a/docs/index.md +++ b/docs/index.md @@ -172,6 +172,7 @@ ViewComponent is built by over a hundred members of the community, including: nshki rainerborene rdavid1099 +richardmarbach rmacklin ryogift sammyhenningsson diff --git a/lib/view_component/test_helpers.rb b/lib/view_component/test_helpers.rb index 9d9b474c5..e7c8f1112 100644 --- a/lib/view_component/test_helpers.rb +++ b/lib/view_component/test_helpers.rb @@ -136,7 +136,7 @@ def with_request_url(path) request.path_info = path request.path_parameters = Rails.application.routes.recognize_path(path) - request.set_header("action_dispatch.request.query_parameters", Rack::Utils.parse_query(path.split("?")[1])) + request.set_header("action_dispatch.request.query_parameters", Rack::Utils.parse_nested_query(path.split("?")[1])) request.set_header(Rack::QUERY_STRING, path.split("?")[1]) yield ensure diff --git a/test/sandbox/test/rendering_test.rb b/test/sandbox/test/rendering_test.rb index 669e5a52d..213f2ce71 100644 --- a/test/sandbox/test/rendering_test.rb +++ b/test/sandbox/test/rendering_test.rb @@ -929,6 +929,10 @@ def test_with_request_url_with_query_parameters with_request_url "/products?mykey=myvalue&otherkey=othervalue" do assert_equal "mykey=myvalue&otherkey=othervalue", request.query_string end + + with_request_url "/products?mykey[mynestedkey]=myvalue" do + assert_equal({ "mynestedkey" => "myvalue" }, request.parameters["mykey"]) + end end def test_components_share_helpers_state From 4bceecfa2cd2d6bfbfcc5ac0b5fcf680b250127a Mon Sep 17 00:00:00 2001 From: Joel Hawksley Date: Tue, 31 May 2022 15:02:34 -0600 Subject: [PATCH 7/8] add `render_preview` test helper (#1347) * clean up previews docs * RSpec not rspec * always find preview for action * rename @rendered_component to @rendered_page * Introduce `render_preview` test helper * rename rendered_page to rendered_content * rename benchmark * copy edits * re-add lookbook note * Update docs/CHANGELOG.md Co-authored-by: Blake Williams * Update docs/CHANGELOG.md Co-authored-by: Blake Williams * update depa * add note to changelog * render_preview is opt-in * fix broken reference in benchmark build * always load descendants * add Preview.load_all/load_all! * how about this? * remove duplicate before_action * Ruby 3 changed error formatting! * don't assert with period * mdlint * rename ivar * always load all previews * try this * explicitly load previews * one more try * this one? * load in engine? * uncomment load_previews call * remove call in engine Co-authored-by: Blake Williams --- .github/workflows/ci.yml | 2 +- Gemfile.lock | 3 + Rakefile | 4 +- .../view_component/preview_actions.rb | 3 +- docs/CHANGELOG.md | 4 ++ docs/guide/previews.md | 65 ++++++++++++------- docs/guide/testing.md | 16 +++++ lib/view_component/preview.rb | 7 +- lib/view_component/render_preview_helper.rb | 40 ++++++++++++ lib/view_component/test_helpers.rb | 12 ++-- .../{benchmark.rb => partial_benchmark.rb} | 0 .../test/components/my_component_test.rb | 17 +++++ .../without_preview_component_test.rb | 18 +++++ test/sandbox/test/integration_test.rb | 4 ++ test/sandbox/test/rendering_test.rb | 2 +- 15 files changed, 160 insertions(+), 37 deletions(-) create mode 100644 lib/view_component/render_preview_helper.rb rename performance/{benchmark.rb => partial_benchmark.rb} (100%) create mode 100644 test/sandbox/test/components/my_component_test.rb create mode 100644 test/sandbox/test/components/without_preview_component_test.rb diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 0347fef41..aa5922ad0 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -19,7 +19,7 @@ jobs: run: | bundle config path vendor/bundle bundle update - bundle exec rake benchmark + bundle exec rake partial_benchmark bundle exec rake translatable_benchmark bundle exec rake slotable_benchmark test: diff --git a/Gemfile.lock b/Gemfile.lock index 9c94ed2eb..ec6585e09 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -272,6 +272,9 @@ DEPENDENCIES haml (~> 5) jbuilder (~> 2) minitest (= 5.6.0) + net-imap + net-pop + net-smtp pry (~> 0.13) rails (~> 7.0.0) rake (~> 13.0) diff --git a/Rakefile b/Rakefile index 138cb6f02..5016e47b3 100644 --- a/Rakefile +++ b/Rakefile @@ -12,8 +12,8 @@ Rake::TestTask.new(:test) do |t| end desc "Runs benchmarks against components" -task :benchmark do - ruby "./performance/benchmark.rb" +task :partial_benchmark do + ruby "./performance/partial_benchmark.rb" end desc "Runs benchmarks against component content area/ slot implementations" diff --git a/app/controllers/concerns/view_component/preview_actions.rb b/app/controllers/concerns/view_component/preview_actions.rb index 5245d98af..5f9779c97 100644 --- a/app/controllers/concerns/view_component/preview_actions.rb +++ b/app/controllers/concerns/view_component/preview_actions.rb @@ -8,7 +8,6 @@ module PreviewActions prepend_view_path File.expand_path("../../../views", __dir__) around_action :set_locale, only: :previews - before_action :find_preview, only: :previews before_action :require_local!, unless: :show_previews? if respond_to?(:content_security_policy) @@ -23,6 +22,8 @@ def index end def previews + find_preview + if params[:path] == @preview.preview_name @page_title = "Component Previews for #{@preview.preview_name}" render "view_components/previews", **determine_layout diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index 842c688b0..d176db0db 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -9,6 +9,10 @@ title: Changelog ## main +* Introduce experimental `render_preview` test helper. Note: `@rendered_component` in `TestHelpers` has been renamed to `@rendered_content`. + + *Joel Hawksley* + * Move framework tests into sandbox application. *Joel Hawksley* diff --git a/docs/guide/previews.md b/docs/guide/previews.md index 02e211626..7562c764a 100644 --- a/docs/guide/previews.md +++ b/docs/guide/previews.md @@ -6,11 +6,7 @@ parent: Guide # Previews -`ViewComponent::Preview`, like `ActionMailer::Preview`, provides a quick way to preview components in isolation. - -_For a more interactive experience, consider using [ViewComponent::Storybook](https://github.com/jonspalmer/view_component_storybook) or [Lookbook](https://github.com/allmarkedup/lookbook)._ - -Define a `ViewComponent::Preview`: +`ViewComponent::Preview`, like `ActionMailer::Preview`, provides a quick way to preview components in isolation: ```ruby # test/components/previews/example_component_preview.rb @@ -19,10 +15,6 @@ class ExampleComponentPreview < ViewComponent::Preview render(ExampleComponent.new(title: "Example component default")) end - def with_long_title - render(ExampleComponent.new(title: "This is a really long title to see how the component renders this")) - end - def with_content_block render(ExampleComponent.new(title: "This component accepts a block of content")) do tag.div do @@ -35,11 +27,30 @@ end Then access the resulting previews at: -* -* -* +* `/rails/view_components/example_component/with_default_title` +* `/rails/view_components/example_component/with_content_block` + +_For a more interactive experience, consider using [Lookbook](https://github.com/allmarkedup/lookbook) or [ViewComponent::Storybook](https://github.com/jonspalmer/view_component_storybook)._ + +## (Experimental) Previews as test cases + +Use `render_preview(name)` to render previews in ViewComponent unit tests: + +```ruby +class ExampleComponentTest < ViewComponent::TestCase + include ViewComponent::RenderPreviewHelper + + def test_render_preview + render_preview(:with_default_title) -It's also possible to set dynamic values from the params by setting them as arguments: + assert_text("Example component default") + end +end +``` + +## Passing parameters + +Set dynamic values from URL parameters by setting them as arguments: ```ruby # test/components/previews/example_component_preview.rb @@ -50,13 +61,17 @@ class ExampleComponentPreview < ViewComponent::Preview end ``` -Which enables passing in a value with . +Then pass in a value: `/rails/view_components/example_component/with_dynamic_title?title=Custom+title`. + +## Helpers The `ViewComponent::Preview` base class includes [`ActionView::Helpers::TagHelper`](https://api.rubyonrails.org/classes/ActionView/Helpers/TagHelper.html), which provides the [`tag`](https://api.rubyonrails.org/classes/ActionView/Helpers/TagHelper.html#method-i-tag) and [`content_tag`](https://api.rubyonrails.org/classes/ActionView/Helpers/TagHelper.html#method-i-content_tag) view helper methods. -Previews use the application layout by default, but can use a specific layout with the `layout` option: +## Layouts + +Previews render with the application layout by default, but can use a specific layout with the `layout` option: ```ruby # test/components/previews/example_component_preview.rb @@ -67,7 +82,7 @@ class ExampleComponentPreview < ViewComponent::Preview end ``` -To set a custom layout for previews and the previews index page, set: `default_preview_layout`: +To set a custom layout for individual previews and the previews index page, set: `default_preview_layout`: ```ruby # config/application.rb @@ -75,6 +90,8 @@ To set a custom layout for previews and the previews index page, set: `default_p config.view_component.default_preview_layout = "component_preview" ``` +## Preview paths + Preview classes live in `test/components/previews`, which can be configured using the `preview_paths` option: ```ruby @@ -82,15 +99,15 @@ Preview classes live in `test/components/previews`, which can be configured usin config.view_component.preview_paths << "#{Rails.root}/lib/component_previews" ``` -Previews are served from by default. To use a different endpoint, set the `preview_route` option: +## Previews route + +Previews are served from `/rails/view_components` by default. To use a different endpoint, set the `preview_route` option: ```ruby # config/application.rb config.view_component.preview_route = "/previews" ``` -This example will make the previews available from . - ## Preview templates Given a preview `test/components/previews/cell_component_preview.rb`, template files can be defined at `test/components/previews/cell_component_preview/`: @@ -140,11 +157,11 @@ class CellComponentPreview < ViewComponent::Preview end ``` -Which enables passing in a value with . +Which enables passing in a value: `/rails/view_components/cell_component/default?title=Custom+title&subtitle=Another+subtitle`. ## Configuring preview controller -Previews can be extended to allow users to add authentication, authorization, before actions, or anything that the end user would need to meet their needs using the `preview_controller` option: +Extend previews to add authentication, authorization, before actions, etc. using the `preview_controller` option: ```ruby # config/application.rb @@ -170,11 +187,11 @@ Source previews are disabled by default. To enable or disable source previews, u config.view_component.show_previews_source = true ``` -To render a source preview in a different place, use the view helper `preview_source` from within your preview template or preview layout. +To render the source preview in a different location, use the view helper `preview_source` from within the preview template or preview layout. -## Using with rspec +## Use with RSpec -When using previews with rspec, replace `test/components` with `spec/components` and update `preview_paths`: +When using previews with RSpec, replace `test/components` with `spec/components` and update `preview_paths`: ```ruby # config/application.rb diff --git a/docs/guide/testing.md b/docs/guide/testing.md index 9f2ae7b5b..867b6690f 100644 --- a/docs/guide/testing.md +++ b/docs/guide/testing.md @@ -26,6 +26,22 @@ end _Note: `assert_selector` only matches on visible elements by default. To match on elements regardless of visibility, add `visible: false`. See the [Capybara documentation](https://rubydoc.info/github/jnicklas/capybara/Capybara/Node/Matchers) for more details._ +## (Experimental) Previews as test cases + +Use `render_preview(name)` to render previews in ViewComponent unit tests: + +```ruby +class ExampleComponentTest < ViewComponent::TestCase + include ViewComponent::RenderPreviewHelper + + def test_render_preview + render_preview(:with_default_title) + + assert_text("Example component default") + end +end +``` + ## Best practices Prefer testing the rendered output over individual methods: diff --git a/lib/view_component/preview.rb b/lib/view_component/preview.rb index bbe899681..06bc68477 100644 --- a/lib/view_component/preview.rb +++ b/lib/view_component/preview.rb @@ -30,7 +30,8 @@ def render_with_template(template: nil, locals: {}) class << self # Returns all component preview classes. def all - load_previews if descendants.empty? + load_previews + descendants end @@ -98,14 +99,14 @@ def preview_source(example) source[1...(source.size - 1)].join("\n") end - private - def load_previews Array(preview_paths).each do |preview_path| Dir["#{preview_path}/**/*_preview.rb"].sort.each { |file| require_dependency file } end end + private + def preview_paths Base.preview_paths end diff --git a/lib/view_component/render_preview_helper.rb b/lib/view_component/render_preview_helper.rb new file mode 100644 index 000000000..dff5785c2 --- /dev/null +++ b/lib/view_component/render_preview_helper.rb @@ -0,0 +1,40 @@ +# frozen_string_literal: true + +module ViewComponent + module RenderPreviewHelper + # Render a preview inline. Internally sets `page` to be a `Capybara::Node::Simple`, + # allowing for Capybara assertions to be used: + # + # ```ruby + # render_preview(:default) + # assert_text("Hello, World!") + # ``` + # + # Note: `#rendered_preview` expects a preview to be defined with the same class + # name as the calling test, but with `Test` replaced with `Preview`: + # + # MyComponentTest -> MyComponentPreview etc. + # + # @param preview [String] The name of the preview to be rendered. + # @return [Nokogiri::HTML] + def render_preview(name) + begin + preview_klass = self.class.name.gsub("Test", "Preview") + preview_klass = preview_klass.constantize + rescue NameError + raise NameError.new( + "`render_preview` expected to find #{preview_klass}, but it does not exist." + ) + end + + previews_controller = build_controller(ViewComponent::Base.preview_controller.constantize) + previews_controller.request.params[:path] = "#{preview_klass.preview_name}/#{name}" + previews_controller.response = ActionDispatch::Response.new + result = previews_controller.previews + + @rendered_content = result + + Nokogiri::HTML.fragment(@rendered_content) + end + end +end diff --git a/lib/view_component/test_helpers.rb b/lib/view_component/test_helpers.rb index e7c8f1112..c18915162 100644 --- a/lib/view_component/test_helpers.rb +++ b/lib/view_component/test_helpers.rb @@ -1,5 +1,7 @@ # frozen_string_literal: true +require "view_component/render_preview_helper" + module ViewComponent module TestHelpers begin @@ -7,7 +9,7 @@ module TestHelpers include Capybara::Minitest::Assertions def page - Capybara::Node::Simple.new(@rendered_component) + Capybara::Node::Simple.new(@rendered_content) end def refute_component_rendered @@ -41,14 +43,14 @@ def refute_component_rendered # @param component [ViewComponent::Base, ViewComponent::Collection] The instance of the component to be rendered. # @return [Nokogiri::HTML] def render_inline(component, **args, &block) - @rendered_component = + @rendered_content = if Rails.version.to_f >= 6.1 controller.view_context.render(component, args, &block) else controller.view_context.render_component(component, &block) end - Nokogiri::HTML.fragment(@rendered_component) + Nokogiri::HTML.fragment(@rendered_content) end # Execute the given block in the view context. Internally sets `page` to be a @@ -62,8 +64,8 @@ def render_inline(component, **args, &block) # assert_text("Hello, World!") # ``` def render_in_view_context(&block) - @rendered_component = controller.view_context.instance_exec(&block) - Nokogiri::HTML.fragment(@rendered_component) + @rendered_content = controller.view_context.instance_exec(&block) + Nokogiri::HTML.fragment(@rendered_content) end # @private diff --git a/performance/benchmark.rb b/performance/partial_benchmark.rb similarity index 100% rename from performance/benchmark.rb rename to performance/partial_benchmark.rb diff --git a/test/sandbox/test/components/my_component_test.rb b/test/sandbox/test/components/my_component_test.rb new file mode 100644 index 000000000..8ad691688 --- /dev/null +++ b/test/sandbox/test/components/my_component_test.rb @@ -0,0 +1,17 @@ +# frozen_string_literal: true + +require "test_helper" + +class MyComponentTest < ViewComponent::TestCase + include ViewComponent::RenderPreviewHelper + + def setup + ViewComponent::Preview.load_previews + end + + def test_render_preview + render_preview(:default) + + assert_selector("div", text: "hello,world!") + end +end diff --git a/test/sandbox/test/components/without_preview_component_test.rb b/test/sandbox/test/components/without_preview_component_test.rb new file mode 100644 index 000000000..0626d8d5e --- /dev/null +++ b/test/sandbox/test/components/without_preview_component_test.rb @@ -0,0 +1,18 @@ +# frozen_string_literal: true + +require "test_helper" + +class WithoutPreviewComponentTest < ViewComponent::TestCase + include ViewComponent::RenderPreviewHelper + + def test_render_preview + error = assert_raises NameError do + render_preview(:default) + end + + assert_equal( + error.message.split(".")[0], + "`render_preview` expected to find WithoutPreviewComponentPreview, but it does not exist" + ) + end +end diff --git a/test/sandbox/test/integration_test.rb b/test/sandbox/test/integration_test.rb index 98262a305..a75e7d9a1 100644 --- a/test/sandbox/test/integration_test.rb +++ b/test/sandbox/test/integration_test.rb @@ -3,6 +3,10 @@ require "test_helper" class IntegrationTest < ActionDispatch::IntegrationTest + def setup + ViewComponent::Preview.load_previews + end + def test_rendering_component_in_a_view get "/" assert_response :success diff --git a/test/sandbox/test/rendering_test.rb b/test/sandbox/test/rendering_test.rb index 213f2ce71..5126bde6d 100644 --- a/test/sandbox/test/rendering_test.rb +++ b/test/sandbox/test/rendering_test.rb @@ -22,7 +22,7 @@ def test_render_inline_returns_nokogiri_fragment def test_render_inline_sets_rendered_component render_inline(MyComponent.new) - assert_includes rendered_component, "hello,world!" + assert_includes @rendered_content, "hello,world!" end def test_child_component From 0b55bb7e2c17ecb075789b14fe1a336bd8168344 Mon Sep 17 00:00:00 2001 From: Joel Hawksley Date: Tue, 31 May 2022 15:09:04 -0600 Subject: [PATCH 8/8] release 2.56.0 (#1371) --- Gemfile.lock | 5 +---- docs/CHANGELOG.md | 2 ++ lib/view_component/version.rb | 2 +- 3 files changed, 4 insertions(+), 5 deletions(-) diff --git a/Gemfile.lock b/Gemfile.lock index ec6585e09..fe52a994d 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,7 +1,7 @@ PATH remote: . specs: - view_component (2.55.0) + view_component (2.56.0) activesupport (>= 5.0.0, < 8.0) method_source (~> 1.0) @@ -272,9 +272,6 @@ DEPENDENCIES haml (~> 5) jbuilder (~> 2) minitest (= 5.6.0) - net-imap - net-pop - net-smtp pry (~> 0.13) rails (~> 7.0.0) rake (~> 13.0) diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md index d176db0db..73ec5a142 100644 --- a/docs/CHANGELOG.md +++ b/docs/CHANGELOG.md @@ -9,6 +9,8 @@ title: Changelog ## main +## 2.56.0 + * Introduce experimental `render_preview` test helper. Note: `@rendered_component` in `TestHelpers` has been renamed to `@rendered_content`. *Joel Hawksley* diff --git a/lib/view_component/version.rb b/lib/view_component/version.rb index e5a9d0f20..4d0d5d69a 100644 --- a/lib/view_component/version.rb +++ b/lib/view_component/version.rb @@ -3,7 +3,7 @@ module ViewComponent module VERSION MAJOR = 2 - MINOR = 55 + MINOR = 56 PATCH = 0 STRING = [MAJOR, MINOR, PATCH].join(".")