DEV: cards were leaking mousedown event listener (#14206)

This commit is contained in:
Joffrey JAFFEUX 2021-09-01 13:01:37 +02:00 committed by GitHub
parent 1a65f0bfbb
commit 55739fd3c9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 23 additions and 23 deletions

View File

@ -7,6 +7,7 @@ import { escapeExpression } from "discourse/lib/utilities";
import headerOutletHeights from "discourse/lib/header-outlet-height"; import headerOutletHeights from "discourse/lib/header-outlet-height";
import { inject as service } from "@ember/service"; import { inject as service } from "@ember/service";
import { wantsNewWindow } from "discourse/lib/intercept-click"; import { wantsNewWindow } from "discourse/lib/intercept-click";
import { bind } from "discourse-common/utils/decorators";
const DEFAULT_SELECTOR = "#main-outlet"; const DEFAULT_SELECTOR = "#main-outlet";
@ -97,35 +98,16 @@ export default Mixin.create({
afterTransition($(this.element), this._hide.bind(this)); afterTransition($(this.element), this._hide.bind(this));
const id = this.elementId; const id = this.elementId;
const triggeringLinkClass = this.triggeringLinkClass; const triggeringLinkClass = this.triggeringLinkClass;
const clickOutsideEventName = `mousedown.outside-${id}`;
const previewClickEvent = `click.discourse-preview-${id}-${triggeringLinkClass}`; const previewClickEvent = `click.discourse-preview-${id}-${triggeringLinkClass}`;
const mobileScrollEvent = "scroll.mobile-card-cloak"; const mobileScrollEvent = "scroll.mobile-card-cloak";
this.setProperties({ this.setProperties({
boundCardClickHandler: this._cardClickHandler.bind(this), boundCardClickHandler: this._cardClickHandler.bind(this),
clickOutsideEventName,
previewClickEvent, previewClickEvent,
mobileScrollEvent, mobileScrollEvent,
}); });
$("html") document.addEventListener("mousedown", this._clickOutsideHandler);
.off(clickOutsideEventName)
.on(clickOutsideEventName, (e) => {
if (this.visible) {
const $target = $(e.target);
if (
$target.closest(`[data-${id}]`).data(id) ||
$target.closest(`a.${triggeringLinkClass}`).length > 0 ||
$target.closest(`#${id}`).length > 0
) {
return;
}
this._close();
}
return true;
});
_cardClickListenerSelectors.forEach((selector) => { _cardClickListenerSelectors.forEach((selector) => {
document document
@ -336,16 +318,16 @@ export default Mixin.create({
willDestroyElement() { willDestroyElement() {
this._super(...arguments); this._super(...arguments);
const clickOutsideEventName = this.clickOutsideEventName;
const previewClickEvent = this.previewClickEvent;
$("html").off(clickOutsideEventName); document.removeEventListener("mousedown", this._clickOutsideHandler);
_cardClickListenerSelectors.forEach((selector) => { _cardClickListenerSelectors.forEach((selector) => {
document document
.querySelector(selector) .querySelector(selector)
.removeEventListener("click", this.boundCardClickHandler); .removeEventListener("click", this.boundCardClickHandler);
}); });
const previewClickEvent = this.previewClickEvent;
this.appEvents.off(previewClickEvent, this, "_previewClick"); this.appEvents.off(previewClickEvent, this, "_previewClick");
this.appEvents.off( this.appEvents.off(
@ -364,4 +346,22 @@ export default Mixin.create({
target.focus(); target.focus();
} }
}, },
@bind
_clickOutsideHandler(event) {
if (this.visible) {
const $target = $(event.target);
if (
$target.closest(`[data-${this.elementId}]`).data(this.elementId) ||
$target.closest(`a.${this.triggeringLinkClass}`).length > 0 ||
$target.closest(`#${this.elementId}`).length > 0
) {
return;
}
this._close();
}
return true;
},
}); });