fix(button): sometimes submits form even when click listener prevents…

… default Fixes #5032 PiperOrigin-RevId: 588925434
material-components · Dec 7, 2023 · 9e3f080 · 9e3f080
1 parent e78a52f
commit 9e3f080
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/internal/controller/form-submitter.ts b/internal/controller/form-submitter.ts
@@ -93,9 +93,9 @@ export function setupFormSubmitter(ctor: FormSubmitterConstructor) {
         return;
       }
 
-      // Wait a microtask for event bubbling to complete.
+      // Wait a full task for event bubbling to complete.
       await new Promise<void>((resolve) => {
-        resolve();
+        setTimeout(resolve);
       });
 
       if (event.defaultPrevented) {

diff --git a/internal/controller/form-submitter_test.ts b/internal/controller/form-submitter_test.ts
@@ -68,6 +68,8 @@ describe('setupFormSubmitter()', () => {
     spyOn(form, 'requestSubmit');
     spyOn(form, 'reset');
     await harness.clickWithMouse();
+    // Submission happens after a task
+    await env.waitForStability();
 
     expect(form.requestSubmit).toHaveBeenCalled();
     expect(form.reset).not.toHaveBeenCalled();
@@ -80,6 +82,8 @@ describe('setupFormSubmitter()', () => {
     spyOn(form, 'requestSubmit');
     spyOn(form, 'reset');
     await harness.clickWithMouse();
+    // Submission happens after a task
+    await env.waitForStability();
 
     expect(form.requestSubmit).not.toHaveBeenCalled();
     expect(form.reset).toHaveBeenCalled();
@@ -100,6 +104,8 @@ describe('setupFormSubmitter()', () => {
     );
 
     await harness.clickWithMouse();
+    // Submission happens after a task
+    await env.waitForStability();
 
     expect(form.requestSubmit).not.toHaveBeenCalled();
   });
@@ -115,6 +121,8 @@ describe('setupFormSubmitter()', () => {
     form.addEventListener('submit', submitListener);
 
     await harness.clickWithMouse();
+    // Submission happens after a task
+    await env.waitForStability();
 
     expect(submitListener).toHaveBeenCalled();
     const event = submitListener.calls.argsFor(0)[0] as SubmitEvent;
@@ -133,6 +141,8 @@ describe('setupFormSubmitter()', () => {
     harness.element.value = 'bar';
 
     await harness.clickWithMouse();
+    // Submission happens after a task
+    await env.waitForStability();
 
     const formData = Array.from(new FormData(form));
     expect(formData.length).withContext('formData.length').toBe(1);