Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unable to correct value in day segment on useDateField #4087

Closed
lightwave opened this issue Feb 19, 2023 · 5 comments
Closed

Unable to correct value in day segment on useDateField #4087

lightwave opened this issue Feb 19, 2023 · 5 comments
Labels
bug Something isn't working rsp:DatePicker

Comments

@lightwave
Copy link

馃悰 Bug Report

useDateField broke on day segment. When first entered into the yyyy/mm/dd segment and type in 2023 12 31, it works. Now press backspace to delete 31 on the day segment. The dd placeholder should show. (Don't unfocus from the segment.) Enter 2, and 02 is displayed in the day segment. Then type e.g., the digit 5, to finish entering day 25 of the month. Expect 25 to be entered but instead, 05 is shown.

馃 Expected Behavior

Expect to be able to edit/correct day entered in the day segment. e.g., enter 30, backspace backspace and enter 25. 25 should be the day but it's 05.

馃槸 Current Behavior

When first entered into the yyyy/mm/dd segment and type in 2023 12 31, it works. Now press backspace to delete 31 on the day segment. The dd placeholder should show. (Don't unfocus from the segment.) Enter 2, and 02 is displayed in the day segment. Then type e.g., the digit 5, to finish entering day 25 of the month. Expect 25 to be entered but instead, 05 is shown.

馃拋 Possible Solution

the problem is that the day segment as zero leading text in it. A possible solution is not to normalized the text with leading zero until blur out of that segment.

馃敠 Context

Use is expecting to be able to backspace to correct typo but it's currently impossible to do that. If user move the focus to another control on the page and click back into the segment, then the user can enter the day again, but this "work-around" is discovered by accident and not how it's expected to behave.

馃捇 Code Sample

No need for a separate codesandbox. The documentation page of useDateField has a datefield and you can reproduce the problem there. https://react-spectrum.adobe.com/react-aria/useDateField.html#example

馃實 Your Environment

Software Version(s)
@react-aria/datepicker 3.2.1

馃暦 Tracking Issue (optional)

@LFDanLu
Copy link
Member

LFDanLu commented Feb 21, 2023

Is there a particular locale required to reproduce this? The docs for me are mm/dd/yyyy and don't reproduce the issue you describe here.

@LFDanLu LFDanLu added the waiting Waiting on Issue Author label Feb 21, 2023
@lightwave
Copy link
Author

The doc shows yyyy-mm-dd for me. My Mac is set to Canada region which defaults to yyyy-mm-dd date format. For United States region, you can override the default date format to yyyy-mm-dd in MacOS system preferences Region setting.

Thanks

@LFDanLu
Copy link
Member

LFDanLu commented Feb 22, 2023

Verified this locally with the Canada locale set in our storybook. Most likely something with this onInput is my initial thought, thanks for reporting!

@LFDanLu LFDanLu added bug Something isn't working rsp:DatePicker and removed waiting Waiting on Issue Author labels Feb 22, 2023
@ryo-manba
Copy link
Contributor

ryo-manba commented Feb 22, 2024

@LFDanLu
Now that PR #5715 has been merged, this issue may be closed.

@LFDanLu
Copy link
Member

LFDanLu commented Feb 22, 2024

ah good call, closing!

@LFDanLu LFDanLu closed this as completed Feb 22, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working rsp:DatePicker
Projects
Archived in project
Development

No branches or pull requests

3 participants