Skip to content

Conversation

eelikivi
Copy link
Contributor

@eelikivi eelikivi commented Jul 3, 2025

Linked issue: #5609

Problem
The year and month dropdowns are not accessible via keyboard. The dropdown toggles cannot be focused, and the dropdown options cannot be navigated using arrow keys or selected with the Enter key.

Changes

  • Changed the dropdown read view components from div to button to allow keyboard focusing.
  • Added keyboard support for dropdown option components. Arrow keys can now be used to navigate the list, and the Enter key can be used to select an option.

Contribution checklist

  • I have followed the contributing guidelines.
  • I have added sufficient test coverage for my changes.
  • I have formatted my code with Prettier and checked for linting issues with ESLint for code readability.

@martijnrusschen
Copy link
Member

Thanks, this looks interesting. Need to trigger the workflows to run the test suite.

@martijnrusschen
Copy link
Member

Can you try rebasing with the latest changes on the main branch?

Copy link

codecov bot commented Aug 15, 2025

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 97.23%. Comparing base (6d64eff) to head (0f2ba5b).
⚠️ Report is 13 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #5728      +/-   ##
==========================================
+ Coverage   97.19%   97.23%   +0.03%     
==========================================
  Files          30       30              
  Lines        3391     3436      +45     
  Branches     1421     1440      +19     
==========================================
+ Hits         3296     3341      +45     
  Misses         95       95              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

martijnrusschen and others added 2 commits August 15, 2025 22:14
- Add tests for ArrowUp/ArrowDown navigation in month dropdown
- Add tests for Escape key handling in month dropdown
- Add tests for month wrapping (first->last, last->first)
- Add tests for Enter/Escape/Arrow keys in year dropdown
- Improves test coverage to 100% line coverage for both components
- Resolves Codecov coverage gaps in dropdown keyboard accessibility

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Fix memory leak in month dropdown by clearing ref object on re-render
- Add bounds checking for year navigation to prevent focusing non-existent elements
- Use Record<number, Element> instead of array for more efficient ref management
- Improve consistency between month and year dropdown implementations
- Maintain 100% line coverage and improve branch coverage

These improvements address code review feedback and enhance robustness.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
@martijnrusschen martijnrusschen merged commit de1e46a into Hacker0x01:main Aug 15, 2025
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants