Form label not rendering correctly #2408
Description
Steps to reproduce
Given a component in which a form builder is being passed in and is being used to render a form label:
<%= form.label field_name, class: classes do %>
<%= content || label_text %>
<% end %>
This is the actual component:
- https://github.com/sul-dlss/hungry-hungry-hippo/blob/upgrade_view_components/app/components/elements/forms/label_component.rb
- https://github.com/sul-dlss/hungry-hungry-hippo/blob/upgrade_view_components/app/components/elements/forms/label_component.html.erb
Here is a failing test:
https://github.com/sul-dlss/hungry-hungry-hippo/blob/upgrade_view_components/spec/components/elements/forms/label_component_spec.rb
which fails with:
1) Elements::Forms::LabelComponent when label text is not provided creates label using label_text
Failure/Error: expect(page).to have_css('label.form-label:not(.visually-hidden)', text: 'my label')
expected to find visible css "label.form-label:not(.visually-hidden)" with text "my label" but there were no matches. Also found "\n", which matched the selector but not all filters.
# ./spec/components/elements/forms/label_component_spec.rb:20:in `block (3 levels) in <top (required)>'
2) Elements::Forms::LabelComponent when label is hidden creates label with hidden label
Failure/Error: expect(page).to have_css('label.form-label.visually-hidden', text: field_name.to_s)
expected to find visible css "label.form-label.visually-hidden" with text "use_citation" but there were no matches. Also found "\n", which matched the selector but not all filters.
# ./spec/components/elements/forms/label_component_spec.rb:35:in `block (3 levels) in <top (required)>'
3) Elements::Forms::LabelComponent when content is provided creates label using content
Failure/Error: expect(page).to have_css('label.form-label:not(.visually-hidden)', text: 'my label')
expected to find visible css "label.form-label:not(.visually-hidden)" with text "my label" but there were no matches. Also found "\n", which matched the selector but not all filters.
# ./spec/components/elements/forms/label_component_spec.rb:27:in `block (3 levels) in <top (required)>'
4) Elements::Forms::LabelComponent when label text or content is not provided creates label using field name
Failure/Error: expect(page).to have_css('label.form-label:not(.visually-hidden)', text: field_name.to_s)
expected to find visible css "label.form-label:not(.visually-hidden)" with text "use_citation" but there were no matches. Also found "\n", which matched the selector but not all filters.
# ./spec/components/elements/forms/label_component_spec.rb:13:in `block (3 levels) in <top (required)>'
Expected behavior
The content or label text is rendered inside the label tag.
<label class="form-label" for="license">license</label>
Actual behavior
The content or label text is rendering outside the label tag.
license<label class="form-label" for="license\"></label>
Note that this previously worked in v3 with the compatibility patch enabled.
Interestingly, if the variables within the label are replaced with literal text, it renders correctly.
So:
<%= form.label field_name, class: classes do %>
license
<% end %>
renders the expected.
System configuration
Rails version:
8.0.2
Ruby version:
3.3.4
Gem version:
4.0.0