Merge pull request #1140 from City-of-Helsinki/UHF-9699

UHF-9699: Added possibility to close menu toggle with esc

src/js/desktop-menu-toggle.js

@@ -75,6 +75,12 @@ function getSiblings(n) {
   return getChildren(n.parentNode.firstChild, n);
 }
 
+function handleEscKey(event) {
+  if (event.key === 'Escape') {
+    closeOpenItems();
+  }
+}
+
 document.addEventListener('DOMContentLoaded', function startDesktopMenu() {
   // Find all menu items with children menus.
   const itemsWithVisibleChildren = document.querySelectorAll('.desktop-menu .menu--level-0 > .menu__item--item-below');
@@ -91,6 +97,9 @@ document.addEventListener('DOMContentLoaded', function startDesktopMenu() {
       item.addEventListener('mouseleave', mouseLeave, false);
     }
   }
+
+  // Add keydown event listener to handle 'Esc' key
+  document.addEventListener('keydown', handleEscKey);
 });
 
 // Functionality when other menu item is clicked while one is open or

src/js/nav-global/menu.js

@@ -563,7 +563,7 @@ const MobilePanel = {
      * Close menu on Escape button click if it is open.
      */
     document.addEventListener('keydown', (e) => {
-      if ((e.key === 'Escape' || e.key === 'Esc' || e.keyCode === 27) && this.isOpen()) {
+      if (e.key === 'Escape' && this.isOpen()) {
         this.close();
         this.toggleButton.focus();
       }

src/js/nav-toggle/nav-toggle-dropdown.js

@@ -44,7 +44,7 @@ class NavToggleDropdown {
   addListeners() {
     // Close menu on ESC
     document.addEventListener('keydown', (e) => {
-      if ((e.key === 'Escape' || e.key === 'Esc' || e.keyCode === 27) && this.isOpen()) {
+      if (e.key === 'Escape' && this.isOpen()) {
         this.close();
         this.buttonInstance.focus();
       }