From 7969e14c9357269d4f4f1434a91085ce57b49bbf Mon Sep 17 00:00:00 2001 From: Murderlon Date: Wed, 3 Apr 2024 11:10:10 +0200 Subject: [PATCH 1/3] @uppy/form: throw on conflicting options --- packages/@uppy/form/src/index.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/packages/@uppy/form/src/index.ts b/packages/@uppy/form/src/index.ts index 93a28c05de..984e6e8fa9 100644 --- a/packages/@uppy/form/src/index.ts +++ b/packages/@uppy/form/src/index.ts @@ -57,6 +57,12 @@ export default class Form extends BasePlugin< this.type = 'acquirer' this.id = this.opts.id || 'Form' + if (this.opts.submitOnSuccess && this.opts.triggerUploadOnSubmit) { + throw new Error( + 'Can not have both `submitOnSuccess` and `triggerUploadOnSubmit` options enabled at the same time', + ) + } + this.handleFormSubmit = this.handleFormSubmit.bind(this) this.handleUploadStart = this.handleUploadStart.bind(this) this.handleSuccess = this.handleSuccess.bind(this) From 9c0bcbf585be7b3fc6c6040f5b8c6a72f2819118 Mon Sep 17 00:00:00 2001 From: Murderlon Date: Wed, 3 Apr 2024 13:02:30 +0200 Subject: [PATCH 2/3] Do not upload already uploaded files --- packages/@uppy/form/src/index.ts | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/packages/@uppy/form/src/index.ts b/packages/@uppy/form/src/index.ts index 984e6e8fa9..9a181188fe 100644 --- a/packages/@uppy/form/src/index.ts +++ b/packages/@uppy/form/src/index.ts @@ -57,12 +57,6 @@ export default class Form extends BasePlugin< this.type = 'acquirer' this.id = this.opts.id || 'Form' - if (this.opts.submitOnSuccess && this.opts.triggerUploadOnSubmit) { - throw new Error( - 'Can not have both `submitOnSuccess` and `triggerUploadOnSubmit` options enabled at the same time', - ) - } - this.handleFormSubmit = this.handleFormSubmit.bind(this) this.handleUploadStart = this.handleUploadStart.bind(this) this.handleSuccess = this.handleSuccess.bind(this) @@ -87,7 +81,11 @@ export default class Form extends BasePlugin< } handleFormSubmit(ev: Event): void { - if (this.opts.triggerUploadOnSubmit) { + // If `submitOnSuccess` is enabled, Uppy already uploaded the files + // and then calls `form.requestSubmit()`. In that case we don’t want to upload the files again. + const allowUpload = this.uppy.getState().allowNewUpload + + if (this.opts.triggerUploadOnSubmit && allowUpload) { ev.preventDefault() const elements = toArray((ev.target as HTMLFormElement).elements) const disabledByUppy: HTMLButtonElement[] = [] From 22513245fde6ca3f8c4b622769f862a75c95b3f9 Mon Sep 17 00:00:00 2001 From: Murderlon Date: Wed, 3 Apr 2024 14:35:42 +0200 Subject: [PATCH 3/3] Properly fix it this time --- packages/@uppy/form/src/index.ts | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/packages/@uppy/form/src/index.ts b/packages/@uppy/form/src/index.ts index 9a181188fe..9ad700aefe 100644 --- a/packages/@uppy/form/src/index.ts +++ b/packages/@uppy/form/src/index.ts @@ -52,6 +52,12 @@ export default class Form extends BasePlugin< form: HTMLFormElement // TODO: make this private (or at least, mark it as readonly) + /** + * Unfortunately Uppy isn't a state machine in which we can guarantee it's + * currently in one state and one state only so we use this completed property which is set on `upload-success'. + */ + #completed = false + constructor(uppy: Uppy, opts?: FormOptions) { super(uppy, { ...defaultOptions, ...opts }) this.type = 'acquirer' @@ -65,12 +71,14 @@ export default class Form extends BasePlugin< } handleUploadStart(): void { + this.#completed = false if (this.opts.getMetaFromForm) { this.getMetaFromForm() } } handleSuccess(result: Result): void { + this.#completed = true if (this.opts.addResultToForm) { this.addResultToForm(result) } @@ -81,11 +89,7 @@ export default class Form extends BasePlugin< } handleFormSubmit(ev: Event): void { - // If `submitOnSuccess` is enabled, Uppy already uploaded the files - // and then calls `form.requestSubmit()`. In that case we don’t want to upload the files again. - const allowUpload = this.uppy.getState().allowNewUpload - - if (this.opts.triggerUploadOnSubmit && allowUpload) { + if (this.opts.triggerUploadOnSubmit && !this.#completed) { ev.preventDefault() const elements = toArray((ev.target as HTMLFormElement).elements) const disabledByUppy: HTMLButtonElement[] = []