Repository navigation
Conversation
The Menu keydown handler runs for Home and End on the toggle too. The
toggle is outside the `.menu`, so `closest('.menu')` returns null. The
handler then called `preventDefault()` and passed null to
`_getItemsInMenu()`, which threw "TypeError: Illegal invocation".
Return early when the key target is not inside a menu. Home and End now
keep their default action on the toggle, and nothing throws. Inside a
menu, they still move focus to the first or last item.
This branch has not been deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Menu#_handleSubmenuKeydown()handles Home and End for any key target. When the target is the toggle,closest('.menu')returnsnull, because the toggle is outside the menu. The handler callspreventDefault()and then passesnullto_getItemsInMenu(), which throwsTypeError: Illegal invocation..menu. Home and End keep their default action on the toggle, and nothing throws. Inside a menu (items, submenu toggles, a menu moved tocontainer), Home and End still move focus to the first or last item.should leave Home and End to the browser on the toggleinjs/tests/unit/menu.spec.jspresses Home and End on the toggle with the menu closed and open. Before the fix it fails withexpected true to be exactly falseand Vitest reportsTypeError: Illegal invocation. After the fix it passes.npm run js-test(37 files, 1471 tests pass; 1470 onmain),npm run js-lint(0 errors, same 15 warnings asmain) andnpm run js-typecheck.Motivation & Context
To reproduce: focus any
[data-bs-toggle="menu"]button, then press Home or End. Chrome logsUncaught TypeError: Illegal invocation(other browsers word it differently), and the key does nothing because its default action is prevented. This also happens on nav links that toggle a menu.I kept Home and End as plain browser keys on the toggle instead of making them jump into the open menu. The docs list them as moving between menu items, the v5 Dropdown never handled them on the toggle, and the ARIA menu button pattern only gives the button Enter, Space and the arrow keys. Happy to switch to focusing the first or last item if you prefer that.
Type of changes
Checklist
npm run lint)Live previews
Not applicable, JavaScript only change.
Related issues
None.