Fix potential memory leak issue for global hotkeys
import Component from '@ember/component';
-import { get } from '@ember/object';
+import { get, set } from '@ember/object';
import { service } from '@ember-decorators/service';
import ComputedProperty from '@ember/object/computed';
import HotKeys from 'wherehows-web/services/hot-keys';
@@ -39,6 +39,11 @@ export default class GlobalHotkeys extends Component {
@service
hotKeys: ComputedProperty<HotKeys>;
+ /**
+ * The event listener function created for the body
+ */
+ bodyEventListener: (e: KeyboardEvent) => void;
+
/**
* Returns true if target exists, is not an input, and is not an editable div
* @param {HTMLElement} target - target element
@@ -68,7 +73,7 @@ export default class GlobalHotkeys extends Component {
const body = document.querySelector('.ember-application');
if (body) {
- body.addEventListener('keyup', this.onKeyUp.bind(this));
+ body.addEventListener('keyup', set(this, 'bodyEventListener', this.onKeyUp.bind(this)));
}
}
@@ -76,7 +81,7 @@ export default class GlobalHotkeys extends Component {
const body = document.querySelector('.ember-application');
if (body) {
- body.removeEventListener('keyup', this.onKeyUp.bind(this));
+ body.removeEventListener('keyup', this.bodyEventListener);
}
}
}
