diff --git a/src/components/NcActions/NcActions.vue b/src/components/NcActions/NcActions.vue index 217255ad66..38d20440ca 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) + } }, }, @@ -1595,10 +1603,10 @@ 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 +1617,12 @@ export default { } } }, + + handleEscapePressed(event) { + this.closeMenu() + event.preventDefault() + }, + removeCurrentActive() { const currentActiveElement = this.$refs.menu.querySelector('li.active') if (currentActiveElement) {