Procházet zdrojové kódy

@uppy/form: do not emit `'submit'` event more than once (#5299)

Instead of using `requestSubmit` from the `'submit'` event handler (which was causing a loop), we can call `submit()` after checking `reportValidity` to get the same result without re-emitting the event.
Merlijn Vos před 9 měsíci
rodič
revize
03a4cd854a
1 změnil soubory, kde provedl 7 přidání a 10 odebrání
  1. 7 10
      packages/@uppy/form/src/index.ts

+ 7 - 10
packages/@uppy/form/src/index.ts

@@ -52,12 +52,6 @@ export default class Form<M extends Meta, B extends Body> 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<M, B>, opts?: FormOptions) {
     super(uppy, { ...defaultOptions, ...opts })
     this.type = 'acquirer'
@@ -71,25 +65,28 @@ export default class Form<M extends Meta, B extends Body> extends BasePlugin<
   }
 
   handleUploadStart(): void {
-    this.#completed = false
     if (this.opts.getMetaFromForm) {
       this.getMetaFromForm()
     }
   }
 
   handleSuccess(result: Result<M, B>): void {
-    this.#completed = true
     if (this.opts.addResultToForm) {
       this.addResultToForm(result)
     }
 
     if (this.opts.submitOnSuccess) {
-      this.form.requestSubmit()
+      // Returns true if the element's child controls satisfy their validation constraints.
+      // When false is returned, cancelable invalid events are fired for each invalid child
+      // and validation problems are reported to the user.
+      if (this.form.reportValidity()) {
+        this.form.submit()
+      }
     }
   }
 
   handleFormSubmit(ev: Event): void {
-    if (this.opts.triggerUploadOnSubmit && !this.#completed) {
+    if (this.opts.triggerUploadOnSubmit) {
       ev.preventDefault()
       const elements = toArray((ev.target as HTMLFormElement).elements)
       const disabledByUppy: HTMLButtonElement[] = []