WIP: Allow errors on specific inputs of date-input #3637
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
floehopper
force-pushed
the
allow-errors-on-specific-inputs-of-date-input
branch
from
e055ee9
to
3bcb385
Compare
floehopper
force-pushed
the
allow-errors-on-specific-inputs-of-date-input
branch
from
3bcb385
to
eafaaad
Compare
floehopper
force-pushed
the
allow-errors-on-specific-inputs-of-date-input
branch
from
eafaaad
to
0732c41
Compare
floehopper
force-pushed
the
allow-errors-on-specific-inputs-of-date-input
branch
from
0732c41
to
90b9844
Compare
This captures some aspects of the current behaviour of the input component that weren't previously covered by tests.
floehopper
force-pushed
the
allow-errors-on-specific-inputs-of-date-input
branch
from
90b9844
to
aa4439e
Compare
It doesn't make sense to me to render an empty error-message paragraph element if no error_message or error_items are set. However, it does still make sense to add the error CSS class to the input element. This commit changes the input component so it only renders the error-message paragraph if error_message is present or there are some error_items. My motivation for making this change is so that I can change the date-input component to support errors on individual input elements, e.g. just the year input element. This usage is described in the docs for the date-input component [1]: > If you’re highlighting just one field - either the day, month or year > - only style the field that has an error. The error message must say > which field has an error, like this: However, highlighting just one field like this is not actually currently supported by the date-input component which is a bit confusing! [1]: https://design-system.service.gov.uk/components/date-input/#error-messages
This captures some aspects of the current behaviour of the date-input component that weren't previously covered by tests.
As suggested in #3510. This changes the date-input component so it supports errors on individual input elements, e.g. just the `year` input element. This usage is described in the docs for the date-input component [1]: > If you’re highlighting just one field - either the day, month or year > - only style the field that has an error. The error message must say > which field has an error, like this: However, highlighting just one field like this is not actually currently supported by the date-input component which is a bit confusing! The new behaviour (where individual fields are highlighted as having an error) is specified by adding values for a `name` key to the `error_items` with the values matching the values of the `name` key in the `items`. If none of the `error_items` have a value for the `name` key, then we fallback to the original behaviour, i.e. all fields are highlighted as having an error. This should hopefully make this a fairly backwardly-compatible change. [1]: https://design-system.service.gov.uk/components/date-input/#error-messages
floehopper
force-pushed
the
allow-errors-on-specific-inputs-of-date-input
branch
from
aa4439e
to
8ba27e9
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What
Why
Visual Changes
Before
After