Skip to content

Conversation

@joelhawksley
Copy link
Member

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

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>
@joelhawksley joelhawksley requested a review from a team July 21, 2020 16:33
Copy link
Contributor

@BlakeWilliams BlakeWilliams left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I had a question about .html_safe, but otherwise looks great!


# 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?
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@BlakeWilliams capture returns an ActiveSupport::SafeBuffer, so I think we're fine to assume that it is safe.

@joelhawksley joelhawksley merged commit 4abb842 into master Jul 21, 2020
@joelhawksley joelhawksley deleted the strip-output branch July 21, 2020 20:17
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>"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What would we have to do to get this to succeed?

Suggested change
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>"

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jonrohan we'd have to strip the rendered output for the component itself. It's certainly doable 😄

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The browser wouldn't treat these differently, but they are 10 bytes in size difference.

Copy link

@jduff jduff Jul 21, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants