diff --git a/app/views/lookbook/previews/preview.html.erb b/app/views/lookbook/previews/preview.html.erb index f0f062621..9a92a2387 100644 --- a/app/views/lookbook/previews/preview.html.erb +++ b/app/views/lookbook/previews/preview.html.erb @@ -1,6 +1,6 @@ <% if @render_args[:component] %> <% if defined?(Phlex::SGML) && @render_args[:component].is_a?(Phlex::SGML) %> - <%= raw(@render_args[:component].call(view_context: self, &@render_args[:block])) %> + <%= render(@render_args[:component]) { @render_args[:component].instance_eval(&@render_args[:block]) } %> <% else %> <%= render(@render_args[:component], @render_args[:args], &@render_args[:block]) %> <% end %> diff --git a/spec/dummy/app/views/phlex/card_example.rb b/spec/dummy/app/views/phlex/card_example.rb new file mode 100644 index 000000000..44ed266cc --- /dev/null +++ b/spec/dummy/app/views/phlex/card_example.rb @@ -0,0 +1,11 @@ +module Views::Phlex + class CardExample < Phlex::HTML + def template(&content) + div class: "card", &content + end + + def footer(&content) + div class: "card-footer", &content + end + end +end diff --git a/spec/dummy/test/components/previews/phlex_example_preview.rb b/spec/dummy/test/components/previews/phlex_example_preview.rb index 3b920ec8b..9d041f656 100644 --- a/spec/dummy/test/components/previews/phlex_example_preview.rb +++ b/spec/dummy/test/components/previews/phlex_example_preview.rb @@ -13,4 +13,21 @@ def builder list.item { "World" } end end + + def phlex_dsl + render Views::Phlex::CardExample.new do |card| + h1 { "My card" } + + div class: "card-body" do + render Views::Phlex::ListExample.new do |list| + list.item { "Hello" } + list.item { "World" } + end + end + + card.footer do + span { "Hey ya!" } + end + end + end end diff --git a/spec/requests/previews_spec.rb b/spec/requests/previews_spec.rb index 83e053dce..3fa9b78dd 100644 --- a/spec/requests/previews_spec.rb +++ b/spec/requests/previews_spec.rb @@ -44,6 +44,15 @@ expect(html.has_css?("li", text: "Hello")).to be true expect(html.has_css?("li", text: "World")).to be true end + + it "allows phlex DSL" do + get lookbook_preview_path("phlex_example/phlex_dsl") + + expect(html.has_css?(".card > h1", text: "My card")).to be true + expect(html.has_css?(".card > .card-body > ul > li", text: "Hello")).to be true + expect(html.has_css?(".card > .card-body > ul > li", text: "World")).to be true + expect(html.has_css?(".card > .card-footer > span", text: "Hey ya!")).to be true + end end end