[Accessibility][Keyboard][Assignment]: Incorrect focus order inside the calender widgets.
Issue 1: Platform: Windows 11 / Chrome / Keyboard
Steps to reproduce:
- Open the URL "https://nglsync.cengage.com/rostering/Account/LogOn?DistrictLoginCode=JVXZ".
- Click on the "Continue" button.
- Login with the Teacher credentials(email & password).
- Navigate near "Launch" for HS Physics and activate. 5.Select assignment from menu
- Select a Material and on next page activate "Assign" button. 7.Observe that the focus order inside the calendar widgets is incorrect.
Actual Result: When the calendar opens, keyboard focus is incorrectly placed on the month and year label (“July 2025”), rather than the currently selected date or the current system date and after pressing tab focus shifts to the “Previous Year” control instead of following a logical, forward progression to the “Next Year” or date grid. This creates an unexpected and unintuitive focus order, making it difficult for users to efficiently interact with the calendar component.
Expected Result: Keyboard focus should follow a logical, predictable order matching the visual layout. Arrow keys should navigate through days sequentially within the calendar grid. Tab and Shift+Tab should move focus into and out of the calendar widget in a natural, intuitive order.
It seems that in the latest React Magma version with updated Select month and year it was fixed.
Need to recheck the focus order inside it.
Issue 2: Instances 1: Same issue is repro for "Assign Activity" from "Search". Steps to reproduce:
- Open the URL "https://nglsync.cengage.com/rostering/Account/LogOn?DistrictLoginCode=JVXZ".
- Click on the "Continue" button.
- Enter Teacher email and password and do sign in.
- Select "My course" from main menu.
- Select the course key: "MTPP9SQ54DWM" from HS Physics and launch the course from the "Launch course" button.
- Assign the activity from Search>Results.
WCAG Guideline: 2.4.3 Focus order
User Impact: Users relying on keyboard navigation and screen readers experience confusion, difficulty, and inefficiency. This barrier may prevent users from successfully selecting dates or completing tasks involving the calendar.
Recommendation: Ensure when the calendar opens, focus should land on the current date or the selected date able to use arrow keys for navigating dates within the calendar grid.
Screencast: https://app.screencast.com/FkOQeOFUoG4Zp
https://github.com/user-attachments/assets/9671da9a-dbc2-4ab1-b0f8-8903a2ceda3a