Slots return stripped HTML #414
Conversation
While building a component that leveraged Slots, we ran into an issue where it was difficult to not introduce unintended whitespace in the rendered HTML for the component. This change strips the rendered HTML for slots, so that we don't end up with unintentional whitespace in the rendered output. Co-authored-by: Jason Long <jasonlong@github.com>
| @@ -98,7 +98,7 @@ def slot(slot_name, **args, &block) | |||
| slot_instance = args.present? ? slot_class.new(**args) : slot_class.new | |||
|
|
|||
| # Capture block and assign to slot_instance#content | |||
| slot_instance.content = view_context.capture(&block) if block_given? | |||
| slot_instance.content = view_context.capture(&block).strip.html_safe if block_given? | |||
There was a problem hiding this comment.
Will .capture always return html_safe? content?
I'm curious if it'd make sense to check if the captured content is html_safe? and only apply html_safe if it was already marked as HTML safe.
There was a problem hiding this comment.
@BlakeWilliams capture returns an ActiveSupport::SafeBuffer, so I think we're fine to assume that it is safe.
| @@ -359,6 +359,11 @@ class IntegrationTest < ActionDispatch::IntegrationTest | |||
| assert_select(".item.normal", count: 2) | |||
|
|
|||
| assert_select(".footer.text-blue h3", text: "This is the footer") | |||
|
|
|||
| title_node = Nokogiri::HTML.fragment(response.body).css(".title").to_html | |||
| expected_title_html = "<div class=\"title\">\n <p>This is my title!</p>\n </div>" | |||
There was a problem hiding this comment.
What would we have to do to get this to succeed?
| expected_title_html = "<div class=\"title\">\n <p>This is my title!</p>\n </div>" | |
| expected_title_html = "<div class=\"title\"><p>This is my title!</p></div>" |
There was a problem hiding this comment.
@jonrohan we'd have to strip the rendered output for the component itself. It's certainly doable 😄
There was a problem hiding this comment.
The browser wouldn't treat these differently, but they are 10 bytes in size difference.
There was a problem hiding this comment.
I recently made some changes to assert_dom_equal so that it ignores white space between elements. I’ve been using it to test the output of my view components and it has been working well. It’s in master but not a released version of the gem, but might be something to look at for this rails/rails-dom-testing#84
While building a component that leveraged Slots,
we ran into an issue where it was difficult to not introduce
unintended whitespace in the rendered HTML for the component.
This change strips the rendered HTML for slots, so that
we don't end up with unintentional whitespace in the rendered
output.
Co-authored-by: Jason Long jasonlong@github.com