Skip to content

First focused date not selectable via keyboard #39

@CissiWong

Description

@CissiWong

The date that is initially focused and selected in the date picker with calendar, is not selectable by keyboard.
Screen readers will announce the initial date as selected, but on pressing enter, the value is in fact not captured.

The user must use arrows to move to another date and then back, in order to select a date and capture the value.

There seem to be no way around this?

To reproduce:
Use the basic setup, open the calendar via keyboard and press enter on the first selected date. No console.log is produced.

<DatePicker onSelect={date => console.log(date)}>
  <DatePickerInput />

  <DatePickerCalendar>
    <DatePickerMonth />
    <DatePickerButton updateMonth={({ prev }) => prev()}>
      Prev Month
    </DatePickerButton>
    <DatePickerButton updateMonth={({ next }) => next()}>
      Next Month
    </DatePickerButton>
    <DatePickerTable />
  </DatePickerCalendar>
</DatePicker>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions