-
Notifications
You must be signed in to change notification settings - Fork 2.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix #4483: Enable onKeyDown handler for the month picker view and the year picker view #4533
Fix #4483: Enable onKeyDown handler for the month picker view and the year picker view #4533
Conversation
Used `handleOnMonthKeyDown` for MonthPicker component to handle Key down events as the `handleOnKeyDown` prop was linked with `handleOnDayKeyDown` (& passed to the Week component)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
✅ This pull request was sent to the PullRequest network.
@balajis-qb you can click here to see the review status or cancel the code review job.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
PullRequest Breakdown
Reviewable lines of change
+ 61
- 0
84% JavaScript (tests)
16% JavaScript
Type of change
Fix - These changes are likely to be fixing a bug or issue.
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #4533 +/- ##
=======================================
Coverage 95.45% 95.45%
=======================================
Files 29 29
Lines 2530 2533 +3
Branches 1037 1039 +2
=======================================
+ Hits 2415 2418 +3
Misses 115 115 ☔ View full report in Codecov by Sentry. |
test/month_test.test.js
Outdated
onKeyDown={onKeyDownSpy} | ||
/>, | ||
); | ||
TestUtils.Simulate.focus(ReactDOM.findDOMNode(datePicker.input)); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I believe this is deprecated behavior. Can you use the new RTL library?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Updated
test/month_test.test.js
Outdated
); | ||
TestUtils.Simulate.focus(ReactDOM.findDOMNode(datePicker.input)); | ||
|
||
const month = TestUtils.findRenderedDOMComponentWithClass( |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Same
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Great start here. I don't have any further notes beyond the comments left by martijnrusschen.
Reviewed with ❤️ by PullRequest
Thanks for the fix! |
Closes #4483
Description
This PR addresses the missing event handling to handle the key-press event for the month picker and the year picker. For the Year Picker component, I added
onKeyDown
and mapped it to the corresponding prop. However, the MonthPicker (month.jsx
) is already receivingonKeyDown
event, but that was mapped to the handlerhandleOnDayKeyDown
which is the handler specifically we're using onday.jsx
. Inmonth.jsx
we're not directly using it, but passing that to theWeek
component. Hence for the month.jsx alone, I didn't change any of its current behavior, and I added a new prop namedhandleOnMonthKeyDown
which is linked to theonKeyDown
event handler we pass from the DatePicker component. So users can still useonKeyDown
itself for any datepicker view (day/month/year), but internallymonth.jsx
alone is handling it viahandleOnMonthKeyDown
.Changes Made
onKeyDown
event.