From 1d0a5c0e87c42a391acfb6a4f668721e951a5d89 Mon Sep 17 00:00:00 2001
From: Tim Donohue <tim.donohue@lyrasis.org>
Date: Fri, 1 Oct 2021 16:39:17 -0500
Subject: [PATCH] Switch from keyup to keydown to fix spacebar scrolling issue.

---
 .../expandable-navbar-section.component.html     |  4 ++--
 .../expandable-navbar-section.component.spec.ts  | 16 ++++++++--------
 2 files changed, 10 insertions(+), 10 deletions(-)

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', () => {