fix(form): correct misleading validation messages for date/time bounds#1894
fix(form): correct misleading validation messages for date/time bounds#1894chintankavathia wants to merge 1 commit intomainfrom
Conversation
The min/max validation messages implied exclusive bounds (e.g. "Date after 12/03/2025") when the validation is actually inclusive. This caused confusion as the boundary value itself is valid but the message suggested otherwise. Changed wording from "after"/"prior to" to "on or after"/"on or before" for minDate, maxDate, minTime, maxTime, rangeBeforeMinDate, and rangeAfterMaxDate error messages.
There was a problem hiding this comment.
Code Review
This pull request updates validation error messages for date and time ranges to clarify that boundary values are inclusive. Feedback was provided to further refine these messages by removing the word "required" to adhere to UX writing guidelines regarding conciseness and the use of telegram style for interactive UI elements.
| maxDate: t( | ||
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_DATE:Date prior to {{maxString}} required` | ||
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_DATE:Date on or before {{maxString}} required` | ||
| ), | ||
| minDate: t( | ||
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_DATE:Date after {{minString}} required` | ||
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_DATE:Date on or after {{minString}} required` | ||
| ), | ||
| maxTime: t( | ||
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_TIME:Time prior to {{maxString}} required` | ||
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_TIME:Time on or before {{maxString}} required` | ||
| ), | ||
| minTime: t( | ||
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_TIME:Time after {{minString}} required` | ||
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_TIME:Time on or after {{minString}} required` | ||
| ), | ||
| rangeAfterMaxDate: t( | ||
| () => | ||
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_AFTER_MAX_DATE:Period prior to {{maxString}} required` | ||
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_AFTER_MAX_DATE:Period on or before {{maxString}} required` | ||
| ), | ||
| rangeBeforeMinDate: t( | ||
| () => | ||
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_BEFORE_MIN_DATE:Period after {{minString}} required` | ||
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_BEFORE_MIN_DATE:Period on or after {{minString}} required` | ||
| ), |
There was a problem hiding this comment.
According to the UX writing guidelines, validation messages should use telegram style and be as concise as possible. The word "required" at the end of these messages makes them full sentences and is superfluous, as the context of a validation error already implies the requirement. Removing it also improves consistency with other validators in this file (like max and maxlength) which do not use "required" at the end.
| maxDate: t( | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_DATE:Date prior to {{maxString}} required` | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_DATE:Date on or before {{maxString}} required` | |
| ), | |
| minDate: t( | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_DATE:Date after {{minString}} required` | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_DATE:Date on or after {{minString}} required` | |
| ), | |
| maxTime: t( | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_TIME:Time prior to {{maxString}} required` | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_TIME:Time on or before {{maxString}} required` | |
| ), | |
| minTime: t( | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_TIME:Time after {{minString}} required` | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_TIME:Time on or after {{minString}} required` | |
| ), | |
| rangeAfterMaxDate: t( | |
| () => | |
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_AFTER_MAX_DATE:Period prior to {{maxString}} required` | |
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_AFTER_MAX_DATE:Period on or before {{maxString}} required` | |
| ), | |
| rangeBeforeMinDate: t( | |
| () => | |
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_BEFORE_MIN_DATE:Period after {{minString}} required` | |
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_BEFORE_MIN_DATE:Period on or after {{minString}} required` | |
| ), | |
| maxDate: t( | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_DATE:Date on or before {{maxString}}` | |
| ), | |
| minDate: t( | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_DATE:Date on or after {{minString}}` | |
| ), | |
| maxTime: t( | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MAX_TIME:Time on or before {{maxString}}` | |
| ), | |
| minTime: t( | |
| () => $localize`:@@SI_FORM_CONTAINER.ERROR.MIN_TIME:Time on or after {{minString}}` | |
| ), | |
| rangeAfterMaxDate: t( | |
| () => | |
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_AFTER_MAX_DATE:Period on or before {{maxString}}` | |
| ), | |
| rangeBeforeMinDate: t( | |
| () => | |
| $localize`:@@SI_FORM_CONTAINER.ERROR.RANGE_BEFORE_MIN_DATE:Period on or after {{minString}}` | |
| ), |
|
@chintankavathia The wording for the validation is aligned with UX, see #1373 |
How does it make sense to say "Date after 20/04/2026 is required" when minDate is 20/04/2026 |
@Danisand can you please share your UX expertise? |
The min/max validation messages implied exclusive bounds (e.g. "Date after 12/03/2025") when the validation is actually inclusive. This caused confusion as the boundary value itself is valid but the message suggested otherwise.
Changed wording from "after"/"prior to" to "on or after"/"on or before" for minDate, maxDate, minTime, maxTime, rangeBeforeMinDate, and rangeAfterMaxDate error messages.
Documentation.
Examples.
Dashboards Demo.
Playwright report.
Coverage Reports: