feat(keyboard): allow to configure keyevent type

when configuring the plugin one can pass the keyEvent as a setting, which accepts 'keyup' and 'keydown'.
Ported for v1

Author: zewa666

src/dialog-renderer.ts

@@ -80,7 +80,7 @@ export class DialogRenderer implements Renderer {
 
   public static trackController(dialogController: DialogController): void {
     if (!DialogRenderer.dialogControllers.length) {
-      DOM.addEventListener('keyup', DialogRenderer.keyboardEventHandler, false);
+      DOM.addEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false);
     }
     DialogRenderer.dialogControllers.push(dialogController);
   }
@@ -91,7 +91,11 @@ export class DialogRenderer implements Renderer {
       DialogRenderer.dialogControllers.splice(i, 1);
     }
     if (!DialogRenderer.dialogControllers.length) {
-      DOM.removeEventListener('keyup', DialogRenderer.keyboardEventHandler, false);
+      DOM.removeEventListener(
+        dialogController.settings.keyEvent || 'keyup',
+        DialogRenderer.keyboardEventHandler,
+        false
+      );
     }
   }
 

src/dialog-settings.ts

@@ -2,6 +2,7 @@ import { Container } from 'aurelia-dependency-injection';
 import { ViewStrategy } from 'aurelia-templating';
 
 export type ActionKey = 'Escape' | 'Enter';
+export type KeyEventType = 'keyup' | 'keydown';
 
 /**
  * All available dialog settings.
@@ -52,6 +53,14 @@ export interface DialogSettings {
    */
   keyboard?: boolean | ActionKey | ActionKey[];
 
+  /**
+   * Determines which type of keyevent should be used to listen for
+   * ENTER and ESC keys
+   *
+   * Default: keyup
+   */
+  keyEvent?: KeyEventType;
+
   /**
    * When set to "true" allows for the dismissal of the dialog by clicking outside of it.
    */

test/unit/dialog-renderer.spec.ts

@@ -209,6 +209,18 @@ describe('DialogRenderer', () => {
       expect(DialogRenderer.dialogControllers.length).toBe(2);
       done();
     });
+
+    it('sets ESC key event handler with custom event type', async done => {
+      spyOn(DOM, 'addEventListener');
+      const keyEvent = 'keydown';
+      const first = createRenderer({ keyEvent });
+      const last = createRenderer();
+      await show(done, first, last);
+      expect(DOM.addEventListener).toHaveBeenCalledWith(keyEvent, jasmine.any(Function), false);
+      expect((DOM.addEventListener as jasmine.Spy).calls.count()).toBe(1);
+      expect(DialogRenderer.dialogControllers.length).toBe(2);
+      done();
+    });
   });
 
   describe('on last closed dialog', () => {