From 04b9bb27bbe151e1bab87a89c407b605d2f12c73 Mon Sep 17 00:00:00 2001 From: Usman Omar Date: Mon, 24 Jun 2024 11:19:59 +0100 Subject: [PATCH] fix: enable keyboard controls on menu items (#8777) ## Description This fix addresses an issue that was introduced in this [refactor](https://github.com/videojs/video.js/commit/35de64ceb04b4b7dd6be067e275128d02c6d6e91#diff-9fd94576fe3b609171a426feb961b0954d70c8c14e598024d49ae9c8836a71ca). At the moment, all key down events that are supposed to interact with the `menu-item` component are now being ignored, meaning you are unable to interact with most of the menu items in the control bar (e.g. captions settings). This PR fixes that by only ignoring key down events that are normally ignored by the `menu-item`. ## Requirements Checklist - [x] Feature implemented / Bug fixed - [ ] If necessary, more likely in a feature request than a bug fix - [ ] Change has been verified in an actual browser (Chrome, Firefox, IE) - [ ] Unit Tests updated or fixed - [ ] Docs/guides updated - [ ] Example created ([starter template on JSBin](https://codepen.io/gkatsev/pen/GwZegv?editors=1000#0)) - [ ] Has no DOM changes which impact accessiblilty or trigger warnings (e.g. Chrome issues tab) - [ ] Has no changes to JSDoc which cause `npm run docs:api` to error - [ ] Reviewed by Two Core Contributors --- src/js/menu/menu-item.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/js/menu/menu-item.js b/src/js/menu/menu-item.js index dcee1bca09..99accf6d46 100644 --- a/src/js/menu/menu-item.js +++ b/src/js/menu/menu-item.js @@ -94,7 +94,7 @@ class MenuItem extends ClickableComponent { * @listens keydown */ handleKeyDown(event) { - if (['Tab', 'Escape', 'ArrowUp', 'ArrowLeft', 'ArrowRight', 'ArrowDown'].includes(event.key)) { + if (!['Tab', 'Escape', 'ArrowUp', 'ArrowLeft', 'ArrowRight', 'ArrowDown'].includes(event.key)) { // Pass keydown handling up for unused keys super.handleKeyDown(event); }