Describe the problem
The PatternFly DatePicker component exhibits unexpected behavior when using the toValidator function in a date range selection scenario. The issue arises when the validator condition checks if the end date is greater than the start date (yyyy-MM-DD > yyyy-MM-DD). This results in the selected styles for the end date range not being applied correctly.
Affected Components
How do you reproduce the problem?
Steps to reproduce:
- Set up a DatePicker component to select a date range.
- Implement a
toValidator function similar to this:
const toValidator = (date) => {
return isValidDate(from) && yyyyMMddFormat(date) > yyyyMMddFormat(from)
? ''
: 'The "to" date must be after the "from" date';
};
- Select a start date at the end of the month.
- Open the end date datepicker and observe that the selected styles for the end date range are not applied.
You can reproduce this issue within the PF datepicker demo example.
Expected behavior
The expected behavior is that when selecting a start date at the end of the month, the end date datepicker should show the correct beginning range with selected styles applied.
Is this issue blocking you?
Not blocking.
Screenshots


Environment
- OS: [e.g. macOS]
- Browser: [e.g. Chrome]
- Version: [e.g. 90.0]
Product and Release Date
(Product details and intended release date for the feature using this component)
Additional Information
Upon changing the toValidator function condition from >= to >, the DatePicker component's end date range start selected styles do not apply as intended. It appears the PatternFly DatePicker requires an end date range that starts with the start date for proper functioning.
Describe the problem
The PatternFly DatePicker component exhibits unexpected behavior when using the
toValidatorfunction in a date range selection scenario. The issue arises when the validator condition checks if the end date is greater than the start date (yyyy-MM-DD > yyyy-MM-DD). This results in the selected styles for the end date range not being applied correctly.Affected Components
How do you reproduce the problem?
Steps to reproduce:
toValidatorfunction similar to this:You can reproduce this issue within the PF datepicker demo example.
Expected behavior
The expected behavior is that when selecting a start date at the end of the month, the end date datepicker should show the correct beginning range with selected styles applied.
Is this issue blocking you?
Not blocking.
Screenshots


Environment
Product and Release Date
(Product details and intended release date for the feature using this component)
Additional Information
Upon changing the
toValidatorfunction condition from>=to>, the DatePicker component's end date range start selected styles do not apply as intended. It appears the PatternFly DatePicker requires an end date range that starts with the start date for proper functioning.