From 1f2a788eeb26e4d388926356d22591a89f6bf798 Mon Sep 17 00:00:00 2001 From: Ferdinand Thiessen Date: Mon, 2 Sep 2024 12:18:18 +0200 Subject: [PATCH] fix(NcActions): Pressing escape should always close the actions 1. Opening actions, then e.g. right-click for context menu. 2. Now press escape -> context menu closes 3. Press escape again -> nothing happens 4. (with this commit): Pressing it a second time will close the actions as expected Signed-off-by: Ferdinand Thiessen --- src/components/NcActions/NcActions.vue | 22 ++++++++++++++++++---- 1 file changed, 18 insertions(+), 4 deletions(-) diff --git a/src/components/NcActions/NcActions.vue b/src/components/NcActions/NcActions.vue index 217255ad66..1a9406275a 100644 --- a/src/components/NcActions/NcActions.vue +++ b/src/components/NcActions/NcActions.vue @@ -1335,6 +1335,14 @@ export default { opened() { this.intersectIntoCurrentFocusTrapStack() + + // Ensure that pressing escape will close the menu even if the menu is not hovered + // and not currently active, e.g. because user opened the context menu + if (this.opened) { + document.body.addEventListener('keydown', this.handleEscapePressed) + } else { + document.body.removeEventListener('keydown', this.handleEscapePressed) + } }, }, @@ -1594,11 +1602,9 @@ export default { } } - if (event.key === 'Escape') { - this.closeMenu() - event.preventDefault() - } + this.handleEscapePressed(event) }, + onTriggerKeydown(event) { if (event.key === 'Escape') { // Tooltip has no focusable elements and the focus remains on the trigger button. @@ -1609,6 +1615,14 @@ export default { } } }, + + handleEscapePressed(event) { + if (event.key === 'Escape') { + this.closeMenu() + event.preventDefault() + } + }, + removeCurrentActive() { const currentActiveElement = this.$refs.menu.querySelector('li.active') if (currentActiveElement) {