Add HintComponent and ErrorMessageComponent

[tmaier]

Closes #97

This is a Pull Request to add components for hints and error messages, as proposed in #36

I introduce here a class attribute called tag. tag_class was not really a good fit for this use case.
Please see, if this fits your idea for the gem.

Note: For some reason of my local setup, I was unable to test this at all. I hope the CI pipeline provides some insights :)

Open Topics

• Ensure enough tests exist and the pass
• Get alignment on .class class attribute
• (idea) Generate ID attribute and show how to use it with aria-describedby . I think Rails 6.1 or 7.0 introduced a convenient helper for this. I am just unsure how it was called...
  • #dom_id
  • sanitize_to_id
  • #field_id

[tmaier]

@Spone I updated that branch. I think it is ready for review

[tmaier]

The field_id helper introduced with Rails 7 is very useful in this regard

<%= form_for @user, builder: ViewComponent::Form::Builder do |f| %>
  <%= f.label :password %>          
  <%= f.password_field :password, aria: { describedby: f.field_id(: password, :description) } %> 
  <div id="<%= f.field_id(:title, :description) %>">
    <%= f.hint :password, 'The password should be at least 8 characters long' %>
    <%= f.error_message :password %>
  </div>
<% end %>

Reference: https://github.com/rails/rails/blob/7-0-stable/actionview/CHANGELOG.md

[tmaier]

All issues should be fixed. Please re-run the CI pipeline

[Spone]

Thank you @tmaier, we've scheduled some time next week to review this PR.

[boardfish]

Mostly spec improvements here. @Spone, I feel like there should be a pattern within specs of component referring to an instance of the ViewComponent to test, and rendered_component referring to the rendered HTML output.

subject should refer to the object that we're testing against, in any case. It's not always easy to whittle that down to just one thing, especially in cases where component should respond to methods in a certain way (render?, errors) and rendered_component should have also changed in response to that (showing the validation error or not), but helpers like have_attributes can help with that. I finished a blog post that might help with that today if you're interested.

[tmaier]

Thanks for the review. I accepted all your changes.

[tmaier]

@Spone can you re-run the CI pipeline, please? And consider to merge it, if it passes...

[nicolas-brousse]

Hi @tmaier sorry for the delay @Spone and I are really busy at work those days.

Also thank you @boardfish for your review ☺️

Thanks for your PR, all is looking good.
I've just one hesitation about naming for error_message, I've created almost the same helper on our existing application, and named it error_field to be close to existing helper. What do you think about @Spone, @boardfish and @tmaier?
I'm okay with error_message it's just a suggestion before we merge this :)

[Spone]

Thanks for your PR, all is looking good. I've just one hesitation about naming for error_message, I've created almost the same helper on our existing application, and named it error_field to be close to existing helper.

I prefer error_message, since this is not really a "field" (you cannot input data in it).

"message" is also the word used in validation options, so the intent is clear if we reuse it.

[tmaier]

I think error_message and hint are consistent with label.

error_field would only be consistent, if we rename hint_field and label_field...

[tmaier]

Besides this: I fixed the specs

[Spone]

Thanks a lot for adding this!