Skip to content

Datepicker field - Inconsistency in accepting leap day input via keyboard #5965

@CristinaTriff

Description

@CristinaTriff

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

Activity

LFDanLu

LFDanLu commented on Mar 1, 2024

@LFDanLu
Member

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

added
bugSomething isn't working
help wantedExtra attention is needed
on Mar 1, 2024
devongovett

devongovett commented on Mar 2, 2024

@devongovett
Member

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

maxkarkowski commented on Nov 12, 2024

@maxkarkowski

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

bmsuseluda commented on Nov 12, 2024

@bmsuseluda

would it be a potential workaround to disable the validation via a new prop?

boutahlilsoufiane

boutahlilsoufiane commented on Jan 18, 2025

@boutahlilsoufiane
Contributor

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

LFDanLu commented on Jan 21, 2025

@LFDanLu
Member

@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

maxkarkowski commented on Apr 24, 2025

@maxkarkowski

any update on this issue?

LFDanLu

LFDanLu commented on Apr 24, 2025

@LFDanLu
Member

No update from our end unfortunately

boutahlilsoufiane

boutahlilsoufiane commented on Apr 28, 2025

@boutahlilsoufiane
Contributor

@LFDanLu Apologies for the delay—I’ve resumed work on the issue.

linked a pull request that will close this issue on Jun 12, 2025
boutahlilsoufiane

boutahlilsoufiane commented on Jun 12, 2025

@boutahlilsoufiane
Contributor

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?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      Participants

      @devongovett@maxkarkowski@LFDanLu@CristinaTriff@bmsuseluda

      Issue actions

        Datepicker field - Inconsistency in accepting leap day input via keyboard · Issue #5965 · adobe/react-spectrum