diff --git a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.html b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.html
index fe31c73066..1a86691c11 100644
--- a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.html
+++ b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.html
@@ -1,7 +1,7 @@
 <div class="nav-item dropdown expandable-navbar-section"
     *ngVar="(active | async) as isActive"
-    (keyup.enter)="isActive ? deactivateSection($event) : activateSection($event)"
-    (keyup.space)="$event.stopPropagation(); isActive ? deactivateSection($event) : activateSection($event)"
+    (keydown.enter)="isActive ? deactivateSection($event) : activateSection($event)"
+    (keydown.space)="isActive ? deactivateSection($event) : activateSection($event)"
     (mouseenter)="activateSection($event)"
     (mouseleave)="deactivateSection($event)">
     <a href="#" class="nav-link dropdown-toggle" routerLinkActive="active"
diff --git a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.spec.ts b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.spec.ts
index 488c9ab251..03e82efb9b 100644
--- a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.spec.ts
+++ b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.spec.ts
@@ -86,8 +86,8 @@ describe('ExpandableNavbarSectionComponent', () => {
         fixture.detectChanges();
 
         const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown'));
-        // dispatch the (keyup.enter) action used in our component HTML
-        sidebarToggler.nativeElement.dispatchEvent(new KeyboardEvent('keyup', { key: 'Enter' }));
+        // dispatch the (keydown.enter) action used in our component HTML
+        sidebarToggler.nativeElement.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter' }));
       });
 
       it('should call activateSection on the menuService', () => {
@@ -104,8 +104,8 @@ describe('ExpandableNavbarSectionComponent', () => {
         fixture.detectChanges();
 
         const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown'));
-        // dispatch the (keyup.enter) action used in our component HTML
-        sidebarToggler.nativeElement.dispatchEvent(new KeyboardEvent('keyup', { key: 'Enter' }));
+        // dispatch the (keydown.enter) action used in our component HTML
+        sidebarToggler.nativeElement.dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter' }));
       });
 
       it('should call deactivateSection on the menuService', () => {
@@ -122,8 +122,8 @@ describe('ExpandableNavbarSectionComponent', () => {
         fixture.detectChanges();
 
         const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown'));
-        // dispatch the (keyup.space) action used in our component HTML
-        sidebarToggler.nativeElement.dispatchEvent(new KeyboardEvent('keyup', { key: ' ' }));
+        // dispatch the (keydown.space) action used in our component HTML
+        sidebarToggler.nativeElement.dispatchEvent(new KeyboardEvent('keydown', { key: ' ' }));
       });
 
       it('should call activateSection on the menuService', () => {
@@ -140,8 +140,8 @@ describe('ExpandableNavbarSectionComponent', () => {
         fixture.detectChanges();
 
         const sidebarToggler = fixture.debugElement.query(By.css('div.nav-item.dropdown'));
-        // dispatch the (keyup.space) action used in our component HTML
-        sidebarToggler.nativeElement.dispatchEvent(new KeyboardEvent('keyup', { key: ' ' }));
+        // dispatch the (keydown.space) action used in our component HTML
+        sidebarToggler.nativeElement.dispatchEvent(new KeyboardEvent('keydown', { key: ' ' }));
       });
 
       it('should call deactivateSection on the menuService', () => {