Emoji picker: Make sure events persist across add/remove from DOM

This commit is contained in:
JC Brand 2020-08-14 15:07:15 +02:00
parent d615cebcfe
commit fbcd7cf737

View File

@ -35,9 +35,7 @@ export default class EmojiPicker extends CustomElement {
super();
this._search_results = [];
this.debouncedFilter = debounce(input => this.model.set({'query': input.value}), 250);
this.onGlobalKeyDown = ev => this._onGlobalKeyDown(ev);
const body = document.querySelector('body');
body.addEventListener('keydown', this.onGlobalKeyDown);
this.registerEvents();
}
get search_results () {
@ -109,10 +107,21 @@ export default class EmojiPicker extends CustomElement {
this.requestUpdate();
}
registerEvents () {
this.onGlobalKeyDown = ev => this._onGlobalKeyDown(ev);
const body = document.querySelector('body');
body.addEventListener('keydown', this.onGlobalKeyDown);
}
connectedCallback () {
super.connectedCallback();
this.registerEvents();
}
disconnectedCallback() {
super.disconnectedCallback()
const body = document.querySelector('body');
body.removeEventListener('keydown', this.onGlobalKeyDown);
super.disconnectedCallback()
}
_onGlobalKeyDown (ev) {
@ -313,6 +322,11 @@ export class EmojiDropdown extends BaseDropdown {
</div>`;
}
connectedCallback () {
super.connectedCallback();
this.render_emojis = false;
}
toggleMenu (ev) {
ev.stopPropagation();
ev.preventDefault();