FIX: Clean up upload events properly in composer (#14052)

I was storing the wrong object as the event listener
reference for the paste and mobile upload button click
events so they were not being cleaned properly on element
destruction.

Also renamed `uploadButton` to the more descriptive
`mobileUploadButton`.
This commit is contained in:
Martin Brennan 2021-08-16 12:59:27 +10:00 committed by GitHub
parent 06ee0e5a51
commit d7390f48c7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 31 additions and 29 deletions

View File

@ -46,9 +46,9 @@ export default Mixin.create({
_unbindUploadTarget() {
this.messageBus.unsubscribe("/uploads/composer");
this.uploadButton?.removeEventListener(
this.mobileUploadButton?.removeEventListener(
"click",
this.uploadButtonEventListener
this.mobileUploadButtonEventListener
);
this.fileInputEl?.removeEventListener(
@ -375,29 +375,28 @@ export default Mixin.create({
},
_bindPasteListener() {
this.pasteEventListener = this.element.addEventListener(
"paste",
(event) => {
if (
document.activeElement !== document.querySelector(".d-editor-input")
) {
return;
}
const { canUpload } = clipboardHelpers(event, {
siteSettings: this.siteSettings,
canUpload: true,
});
if (!canUpload) {
return;
}
if (event && event.clipboardData && event.clipboardData.files) {
this._addFiles([...event.clipboardData.files]);
}
this.pasteEventListener = function pasteListener(event) {
if (
document.activeElement !== document.querySelector(".d-editor-input")
) {
return;
}
);
const { canUpload } = clipboardHelpers(event, {
siteSettings: this.siteSettings,
canUpload: true,
});
if (!canUpload) {
return;
}
if (event && event.clipboardData && event.clipboardData.files) {
this._addFiles([...event.clipboardData.files]);
}
}.bind(this);
this.element.addEventListener("paste", this.pasteEventListener);
},
_addFiles(files) {

View File

@ -333,10 +333,13 @@ export default Mixin.create({
_bindMobileUploadButton() {
if (this.site.mobileView) {
this.uploadButton = document.getElementById("mobile-file-upload");
this.uploadButtonEventListener = this.uploadButton.addEventListener(
this.mobileUploadButton = document.getElementById("mobile-file-upload");
this.mobileUploadButtonEventListener = function mobileButtonEventListener() {
document.getElementById("file-uploader").click();
};
this.mobileUploadButton.addEventListener(
"click",
() => document.getElementById("file-uploader").click(),
this.mobileUploadButtonEventListener,
false
);
}
@ -344,9 +347,9 @@ export default Mixin.create({
@on("willDestroyElement")
_unbindUploadTarget() {
this.uploadButton?.removeEventListener(
this.mobileUploadButton?.removeEventListener(
"click",
this.uploadButtonEventListener
this.mobileUploadButtonEventListener
);
this._validUploads = 0;