adobe / adobe/react-spectrum

Usability issues in DateField/DatePicker

Open
#5,364 12 comments 11 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
15.9k
Forks
1.6k
Avg merge
3d 9m
Merged PRs (30d)
59

Description

### Provide your feedback here.

The documentation writes the following:

_Accessible – Each date and time unit is displayed as an individually focusable and editable segment, which allows users an easy way to edit dates using the keyboard, in any date format and locale._

However, after my experiences of using DateField/DatePicker, I've found the following issues which - at least in my opinion - decrease the usability quite a lot when user is typing the dates.

Some of these findings are only related to locales in format "dd-mm-yyyy" or "dd.mm.yyyy".

- ~~Even if the placeholder indicates "dd.mm.yyyy", it does not accept a leading zero~~ (fixed with #9510)
- ~~This might be related to `shouldForceLeadingZeros` and how it behaves without this forcing. If the locale doesn't show the leading zero, maybe the zero-digit typed by the user should be shown but could disappear after the focus changes to another cell.~~
- If the value has only one digit, it is not possible to move to next cell by typing the separator character (such as dash or dot)
- ~~Typing the digits automatically moves the focus to the next cell but backspacing does not move back to the previous cell~~ (#5261, fixed with #5715)
- ~~Some dates cannot be entered at all, such as "29-02-2020"~~ (#4181, #3256, fixed with #9510)
- It is not possible to copy & paste dates (#5285)
- The field cannot be emptied by pressing Ctrl+A and Backspace/Delete
- It is not possible to use normal arrow keys to move inside a single cell to correct writing because arrow keys always moves between the cells

### 🔦 Context

Users who expect that the DateField would behave more like a traditional text field will find different kind of issues which might decrease the usability of the component.

### 💻 Code Sample

_No response_

### Version

October 02, 2023 Release

### What browsers are you seeing the problem on?

Firefox, Chrome, Microsoft Edge

### If other, please specify

_No response_

### What operating system are you using?

Windows

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.