Move errors inside input-group and form-group.#422
Move errors inside input-group and form-group.#422lcreid wants to merge 18 commits intobootstrap-ruby:masterfrom
Conversation
Added method for error and help and optionally prepend and append.
Here's an example of a CHANGELOG.md entry (place it immediately under the * [#422](https://github.com/bootstrap-ruby/bootstrap_form/pull/422): Move errors inside input-group. - [@lcreid](https://github.com/lcreid).Generated by 🚫 Danger |
| </form> | ||
| HTML | ||
| # TODO: We should build the @builder properly from `bootstrap_form_for`, so it's easier to test errors. | ||
| assert_equivalent_xml expected, bootstrap_form_for(@user) { |f| f.text_field :email, prepend: '$', append: '.00' } |
There was a problem hiding this comment.
I would render @builder.text_field :email, prepend: "foo", append: "bar" instead of doing it though form_helper. Less html that way. All tests should just call helpers directly.
There was a problem hiding this comment.
That's how I started, but then it renders the default Rails error markup. @builder is missing the bootstrap_form override of the default Rails error rendering. I was going to enter an issue to change the way we make the builder, so it would render properly without the extra HTML, which I agree is a unnecessary and can be a pain.
There was a problem hiding this comment.
You can put code used for error suppression (https://github.com/bootstrap-ruby/bootstrap_form/blob/master/lib/bootstrap_form/helper.rb#L45) into setup and teardown for tests that need it. You'll want to extract all tests that deal with error rendering into a separate file though.
There was a problem hiding this comment.
That's a good suggestion. In the spirit of limiting the scope of each PR, I continued to just tolerate a few extra lines of HTML in each test, but we should revisit the suggestion for easier error testing in another PR.
|
The latest push gives better test coverage, so the PR is ready for review. |
There was a problem hiding this comment.
It took me a while to fully understand the issues being addressed here. Thanks for linking to the bug reports; that helped. This PR looks like a reasonable solution to the problems.
I am concerned that form_group no longer outputs errors. This will probably trip up a lot of people who were using form_group to wrap custom controls.
Would it be fair to say that people could get the old behavior by using form_group plus control_error_help?
| input << content_tag(:div, input_group_content(append), class: 'input-group-append') if append | ||
| input << error_text | ||
| # FIXME: TBC The following isn't right yet. Wrap if there were errors. Maybe??? | ||
| input = content_tag(:div, input, class: input_group_class) unless options.empty? && prepend.nil? && append.nil? |
There was a problem hiding this comment.
Is this FIXME still valid? If so, could you clarify what additional cases need to be handled here?
|
Also, do |
|
Thanks for the feedback, @mattbrictson . I'm going to take another look at how this could be done without having to move the error reporting out of
Feel free to ask more questions or give suggestions. I'll make another branch locally and see if I can find a way to keep the error reporting behaviour more consistent with the old way, while still supporting the new requirements. If I figure something out, I'll push a different PR so you can see which makes more sense. |
|
Closed in favor of #434 |
It looks like Bootstrap 4 specifies that errors should be wrapped inside the input or form group (see twbs/bootstrap#25020 and https://getbootstrap.com/docs/4.0/components/forms/#validation). This PR moves the error (and help) text inside the input-group and form-group.
(Based on the examples in the Bootstrap docs, the error and help text doesn't have to be inside an input or form group, but they do have to be within the same container as the
inputorselect, andlabel(if any) of the control.)The changes introduced by this PR can be summarized as:
prepend_and_append_input) to handle the:appendand:prependoptions, the error and help code was moved fromform_grouptoprepend_and_append_inputprepend_and_append_input, an "extract method" was done onprepend_and_append_inputto separate out the code that makes the control, and optionally the error and help text (control_error_help). The helpers were modified to callcontrol_error_helpcheck_boxandradio_buttonmethods, as they fit neither of the above modelsdivI couldn't see another way to move the error text inside the input group, without major changes to
form_groupandform_group_builder.Because in effect the error handling is pushed down to the individual helpers, it's not longer possible to get an error message from
form_groupwhen the contents of the block thatform_groupcalls don't include a call to abootstrap_formhelper. There is one test inbootstrap_form_group_test.rbthat has aform_grouparound aptag, and checks for the error message. This test has been commented out in this PR.NOTE: This PR contains the tests in PR #424, because the tests were needed to ensure this PR didn't introduce regressions.
Fixes #417.
Fixes #418.