From 436c2e76a20eb4e8e08abcf38fbc5407b0c3a9f0 Mon Sep 17 00:00:00 2001 From: Cyperghost Date: Wed, 26 Jun 2024 11:48:03 +0200 Subject: [PATCH] Remove async from `#registerFile()` --- .../Builder/Field/Controller/FileProcessor.ts | 66 ++++++++++--------- .../Builder/Field/Controller/FileProcessor.js | 32 ++++----- 2 files changed, 52 insertions(+), 46 deletions(-) diff --git a/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts b/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts index 8661f6b935..5581103349 100644 --- a/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts +++ b/ts/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.ts @@ -45,12 +45,12 @@ export class FileProcessor { this.#uploadButton = this.#container.querySelector("woltlab-core-file-upload") as WoltlabCoreFileUploadElement; this.#uploadButton.addEventListener("uploadStart", (event: CustomEvent) => { - void this.#registerFile(event.detail); + this.#registerFile(event.detail); }); this.#fileInput = this.#uploadButton.shadowRoot!.querySelector('input[type="file"]')!; this.#container.querySelectorAll("woltlab-core-file").forEach((element) => { - void this.#registerFile(element, element.parentElement); + this.#registerFile(element, element.parentElement); }); } @@ -176,7 +176,7 @@ export class FileProcessor { }; const cancelEventListener = () => { this.#uploadButton.dataset.context = oldContext; - void this.#registerFile(this.#replaceElement!); + this.#registerFile(this.#replaceElement!); this.#replaceElement = undefined; this.#fileInput.removeEventListener("change", changeEventListener); }; @@ -231,7 +231,7 @@ export class FileProcessor { element.querySelector(".fileList__item__progress")?.remove(); } - async #registerFile(element: WoltlabCoreFileElement, container: HTMLElement | null = null): Promise { + #registerFile(element: WoltlabCoreFileElement, container: HTMLElement | null = null): void { if (container === null) { if (this.showBigPreview) { container = this.#container.querySelector(".fileUpload__preview"); @@ -269,36 +269,40 @@ export class FileProcessor { container.append(fileSize); } - try { - this.#trackUploadProgress(container, element); - await element.ready; + this.#trackUploadProgress(container, element); - if (this.#replaceElement !== undefined) { - await deleteFile(this.#replaceElement.fileId!); - this.#replaceElement = undefined; - } - } catch (reason) { - // reinsert the element and show an error message - if (this.#replaceElement !== undefined) { - await this.#registerFile(this.#replaceElement); - this.#replaceElement = undefined; - - if (this.showBigPreview) { - // move the new uploaded file to his own container - // otherwise the file under `this.#replaceElement` will be marked as failed, too - const tmpContainer = document.createElement("div"); - tmpContainer.append(element); - this.#uploadButton.insertAdjacentElement("afterend", tmpContainer); - - container = tmpContainer; + element.ready + .then(() => { + if (this.#replaceElement !== undefined) { + void deleteFile(this.#replaceElement.fileId!); + this.#replaceElement = undefined; } - } - this.#markElementUploadHasFailed(container, element, reason); - return; - } finally { - this.#removeUploadProgress(container); - } + this.#fileInitializationCompleted(element, container!); + }) + .catch((reason) => { + // reinsert the element and show an error message + if (this.#replaceElement !== undefined) { + this.#registerFile(this.#replaceElement); + this.#replaceElement = undefined; + + if (this.showBigPreview) { + // move the new uploaded file to his own container + // otherwise the file under `this.#replaceElement` will be marked as failed, too + const tmpContainer = document.createElement("div"); + tmpContainer.append(element); + this.#uploadButton.insertAdjacentElement("afterend", tmpContainer); + + container = tmpContainer; + } + } + this.#markElementUploadHasFailed(container!, element, reason); + }) + .finally(() => { + this.#removeUploadProgress(container!); + }); + } + #fileInitializationCompleted(element: WoltlabCoreFileElement, container: HTMLElement): void { if (this.showBigPreview) { element.dataset.previewUrl = element.link!; element.unbounded = true; diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js index 94700a0ca4..47edaa86aa 100644 --- a/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js +++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Form/Builder/Field/Controller/FileProcessor.js @@ -29,11 +29,11 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui } this.#uploadButton = this.#container.querySelector("woltlab-core-file-upload"); this.#uploadButton.addEventListener("uploadStart", (event) => { - void this.#registerFile(event.detail); + this.#registerFile(event.detail); }); this.#fileInput = this.#uploadButton.shadowRoot.querySelector('input[type="file"]'); this.#container.querySelectorAll("woltlab-core-file").forEach((element) => { - void this.#registerFile(element, element.parentElement); + this.#registerFile(element, element.parentElement); }); } get classPrefix() { @@ -139,7 +139,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui }; const cancelEventListener = () => { this.#uploadButton.dataset.context = oldContext; - void this.#registerFile(this.#replaceElement); + this.#registerFile(this.#replaceElement); this.#replaceElement = undefined; this.#fileInput.removeEventListener("change", changeEventListener); }; @@ -184,7 +184,7 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui element.classList.remove("fileProcessor__item--uploading"); element.querySelector(".fileList__item__progress")?.remove(); } - async #registerFile(element, container = null) { + #registerFile(element, container = null) { if (container === null) { if (this.showBigPreview) { container = this.#container.querySelector(".fileUpload__preview"); @@ -217,18 +217,19 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui fileSize.textContent = (0, FileUtil_1.formatFilesize)(element.fileSize || parseInt(element.dataset.fileSize)); container.append(fileSize); } - try { - this.#trackUploadProgress(container, element); - await element.ready; + this.#trackUploadProgress(container, element); + element.ready + .then(() => { if (this.#replaceElement !== undefined) { - await (0, DeleteFile_1.deleteFile)(this.#replaceElement.fileId); + void (0, DeleteFile_1.deleteFile)(this.#replaceElement.fileId); this.#replaceElement = undefined; } - } - catch (reason) { + this.#fileInitializationCompleted(element, container); + }) + .catch((reason) => { // reinsert the element and show an error message if (this.#replaceElement !== undefined) { - await this.#registerFile(this.#replaceElement); + this.#registerFile(this.#replaceElement); this.#replaceElement = undefined; if (this.showBigPreview) { // move the new uploaded file to his own container @@ -240,11 +241,12 @@ define(["require", "exports", "tslib", "WoltLabSuite/Core/Language", "WoltLabSui } } this.#markElementUploadHasFailed(container, element, reason); - return; - } - finally { + }) + .finally(() => { this.#removeUploadProgress(container); - } + }); + } + #fileInitializationCompleted(element, container) { if (this.showBigPreview) { element.dataset.previewUrl = element.link; element.unbounded = true; -- 2.20.1