Fix period arrow keys hijacking custom-range calendar#6490
Conversation
- On periods with `< >` controls (Today, Month to Date, Last Month, Year to Date, specific day/month/year), the document-level ArrowLeft/ArrowRight listener kept firing while the calendar popover was open, silently shifting the period and closing the calendar. - Suppress that listener whenever a flatpickr calendar is mounted, via a new `isDateRangeCalendarOpen` predicate on `Keybind.shouldIgnoreWhen`. - Added a regression test covering both directions: arrows still shift the period when the calendar is closed, and no longer do so while it's open.
|
1 similar comment
|
There was a problem hiding this comment.
Tested on staging and it does what intended, so approving 👍
I feel like there's another side to actually making it work though -- the calendar doesn't automatically gain focus. For example, if I hit the down arrow right after opening the calendar, it'll start scrolling down the page (browser default). So even though left/right arrow keys are not affecting the rest of the page (which is correct of course), the keypresses are not registered by the calendar itself either. This is the behaviour I've experienced on Chrome and Safari at least.
@RobertJoonas agree – I actually tried to fix this too but didn't succeed. Since the bug report was about this specifically, I thought it was worth shipping this as-is so that someone else can look into that separately. I will implement your feedback so this can go out and add a card for that as a separate issue! |
f92e361 to
2f3f364
Compare
Changes
< >controls (Today, Month to Date, Last Month, Year to Date, specific day/month/year), the document-level ArrowLeft/ArrowRight listener kept firing while the calendar popover was open, silently shifting the period and closing the calendar.isDateRangeCalendarOpenpredicate onKeybind.shouldIgnoreWhen.Tests
Changelog
Documentation
Dark mode