Cannot select last date (max date) with keyboard

[jlurena]

Describe the bug
When using keyboard to navigate the calendar (arrow keys for instance), cannot select the last date on a calendar with a maxDate prop.

To Reproduce
Steps to reproduce the behavior:

1. Go to https://reactdatepicker.com/
2. Navigate to the Specific date range or Max date demos.
3. Use the keyboard to navigate through the calendar and attempt to select the last selectable date.
4. Cannot select the last date with keyboard.

Expected behavior
A keyboard user should be able to select the last selectable date from the calendar.

Desktop (please complete the following information):

• OS: MacOs
• Browser: Chrome, Safari, FireFox
• Version: 76.0.3809.100, 12.1.2, 68.0.2 (respectively)

[jlurena]

I created PR to fix this issue. #1868

[chrisagnew]

Currently running into this issue too. Would be nice to get fixed as it is causing issues for users with screen readers.

[jlurena]

@chrisagnew the fix is already on the latest release

[chrisagnew]

@jlurena What was the fix? Still running into the issue when using maxDate. Currently running version 2.9.6, the error is the same as the one in the video.

[jlurena]

@chrisagnew not sure, but it was merged. I'm running a forked version with the bug fix I applied and it's working as expected

[chrisagnew]

@jlurena I'm starting to think it is an issue when declaring the initial state of start and end date. It currently works if I set the state to new Date() However this displays the current day, which is clashing with designs. Would there be another type to declare, when declaring the state?

[jlurena]

@jlurena I'm starting to think it is an issue when declaring the initial state of start and end date. It currently works if I set the state to new Date() However this displays the current day, which is clashing with designs. Would there be another type to declare, when declaring the state?

If I'm understanding correctly, I did something similar to what you describe with #1868.

[chrisagnew]

If you don't mind me asking, why are you setting the times like that for start date and end date?

[chrisagnew]

@jlurena Fixed my issue, worked when I declared start date and end date to both be endOfDay. Thank you for the responses, and directing me towards a solution!

[jlurena]

Do you have a custom fork? Thats strange that it'll work like that.

[chrisagnew]

@jlurena I think new Date() was causing an issue with current time and time the date picker popper window was opened. By setting both maxDate to be end of the day, it allowed me to select the current day, as the time was now less than the maxDate. If that makes sense?

[timri]

I noticed a (probably) related issue: using keyboards navigation does not work, if the minDate is in the future.
Reproduce:
navigate to https://reactdatepicker.com/#example-min-date and replace "subDays" by "addDays".

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.