-
Notifications
You must be signed in to change notification settings - Fork 1.3k
Open
Labels
bugSomething isn't workingSomething isn't workinghelp wantedExtra attention is neededExtra attention is neededrsp:DatePicker
Description
Provide a general summary of the issue here
I am seeking to input the date value of 02/29/2024 into the datepicker field exclusively via keyboard input. However, upon entering the first character for the year, the day field automatically changes from 29 to 28.
🤔 Expected Behavior?
02/29/2024 value should be accepted when set from the keyboard.
😯 Current Behavior
The day value 29 is automatically changed to 28 after typing the first character of the year.
💁 Possible Solution
Implement a debounce mechanism on the keyboard to defer validation and automated updates until a period of no events being intercepted for the respective field has elaspsed.
🔦 Context
No response
🖥️ Steps to Reproduce
In the datepicker field type 022920
Datepicker-leapYear.mp4
Version
18.2.0
What browsers are you seeing the problem on?
Chrome
If other, please specify.
No response
What operating system are you using?
Windows
🧢 Your Company/Team
No response
🕷 Tracking Issue
No response
endaquigley, JoaoMosmann and philipallen
Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't workinghelp wantedExtra attention is neededExtra attention is neededrsp:DatePicker
Type
Projects
Milestone
Relationships
Development
Select code repository
Activity
LFDanLu commentedon Mar 1, 2024
Adding a debounce to defer the validation as you suggested sounds reasonable. Alternatively we could compare the current placeholder year with the current user input in the year field and defer updating the year until the user blurs from the field or if the user's input diverges from the placeholder year. This case is pretty specific to entering 2/29 so we could probably limit this logic to running only for that case
devongovett commentedon Mar 2, 2024
I think this is basically the same underlying issue as #3256.
I looked into that one before and attempted to change the representation of incomplete dates. The problem is that the date formatter that's used to generate the UI requires a real date to work. So in this case entering 2/29/2 doesn't exist and the browser's formatter rounds it down even if we don't. Haven't figured out a way to allow invalid dates (while incomplete) and also preserve the internationalization capabilities provided by the formatter.
maxkarkowski commentedon Nov 12, 2024
is there any update on this issue?
seems the dateField is kind of buggy. we are using it for the birthday field in our checkout and it is kind of crucial to get the correct birthDate. And for a user this could be very easily overlooked if he types his birthday 29.02.2000 and it changes automatically to the 28th of february
bmsuseluda commentedon Nov 12, 2024
would it be a potential workaround to disable the validation via a new prop?
boutahlilsoufiane commentedon Jan 18, 2025
Hi @LFDanLu I would love to work on this.
I tried to reproduce the issue but DatePicker doesn't allow me to enter 29 as day.
LFDanLu commentedon Jan 21, 2025
@boutahlilsoufiane Sure! I don't really have any extra guidance other that what was previously mentioned in this thread along with the issue that @devongovett mentioned above however, but here is a sandbox in which you can reproduce the issue: https://codesandbox.io/p/sandbox/fancy-architecture-ptch2p?file=%2Fsrc%2FApp.js%3A16%2C1. The key is to have your placeholder value (usually falls back to the current date if now provided) set to a date where
2/29
is a valid date.maxkarkowski commentedon Apr 24, 2025
any update on this issue?
LFDanLu commentedon Apr 24, 2025
No update from our end unfortunately
boutahlilsoufiane commentedon Apr 28, 2025
@LFDanLu Apologies for the delay—I’ve resumed work on the issue.
boutahlilsoufiane commentedon Jun 12, 2025
Hello @devongovett , thanks for this solution, I have translated into code but I'm not sure if the new behaviour is the expected one, Could I get a review, please?