Skip to content

By pressing tab in DayPickerInput, the body element is focused #594

@thebuilder

Description

@thebuilder

Hey, thanks for a great component - nice with a lightweight and customizable date picker for once!

Using the DayPickerInput breaks the tab flow. If the DayPicker is open (after input gains focus), and you hit tab to move to the next input field the focus is lost. document.activeElement is changed to <body>. I haven't dug into exactly what's going on, but my guess is that the browser tries to set focus to an element inside the DayPicker, which is then lost after it closes.

Because the DayPicker requires focus to catch keyboard events, the keyboard navigation is not working. I don't think you should move the focus to the DayPicker, but it needs to be able to catch the keyboard events from the input field, and preventDefault the ones it uses.

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