bug(DatePicker): Date Range validation error

[lesteral]

Is this a regression?

• [ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

Date range picker gives wrong feedback "Invalid end date"

Reproduction

Steps to reproduce:

1. start at Date range picker forms integration | Datepicker examples | Angular Material
2. for Start Date, type "1/1/2022", then Tab
3. for End Date, type "12/31/22", then Tab
4. so far, so good - see feedback: Selected range: { "start": "2022-01-01T05:00:00.000Z", "end": "2022-12-31T05:00:00.000Z" }
5. click in End Date, change to "12/31/21" (i.e., end of the previous year)
6. as expected: "Invalid end date" - feedback: Selected range: { "start": "2022-01-01T05:00:00.000Z", "end": "2021-12-31T05:00:00.000Z" }
7. click in Start Date, change to "1/1/21", then Tab into "End Date" (no change - still 12/31/21)
8. feedback now (as expected): Selected range: { "start": "2021-01-01T05:00:00.000Z", "end": "2021-12-31T05:00:00.000Z" }
9. however, still shows "Invalid end date" - even though the date range should now be valid
10. further, Tab out of End Date, still shows "Invalid end date" - THIS IS THE ISSUE
11. click in End Date, backspace and re-enter "12/31/21" - only now does the error message go away
12. with some similar machinations, one can get "Invalid start date", with feedback: "Selected range: { "start": "2022-01-01T05:00:00.000Z", "end": "2022-12-31T05:00:00.000Z" } - i.e., wrong feedback even with good data

Expected Behavior

no error message

Actual Behavior

"Invalid end date"

Environment

• Angular: 16
• CDK/Material: 16.0.2
• Browser(s): Google Chrome 113.0.5672.134 (Official Build) (64-bit)
• Operating System (e.g. Windows, macOS, Ubuntu): Chromebook

[lesteral]

Here's another screenshot which more clearly (directly) corresponds with the "Steps to reproduce"

[lesteral]

this looks similar to #24075