feat(form-core): pass onSubmitMeta to onSubmitInvalid and listeners.onSubmit (#1664)

kusiewicz · LeCarbonator · web-flow · commit 58fece970a8f · 2025-08-04T16:11:23.000+02:00
* fix(form-core): pass submit meta to onSubmitInvalid

* chore: change type assertion to be stricter

* feat(form-core): pass onSubmitMeta to onSubmit listeners

* chore: add unit tests

---------

Co-authored-by: LeCarbonator &lt;18158911+LeCarbonator@users.noreply.github.com&gt;
diff --git a/packages/form-core/src/FormApi.ts b/packages/form-core/src/FormApi.ts
@@ -314,6 +314,7 @@ export interface FormListeners<
       TOnServer,
       TSubmitMeta
     >
+    meta: TSubmitMeta
   }) => void
 }
 
@@ -440,6 +441,7 @@ export interface FormOptions<
       TOnServer,
       TSubmitMeta
     >
+    meta: TSubmitMeta
   }) => void
   transform?: FormTransform<
     NoInfer<TFormData>,
@@ -1772,6 +1774,9 @@ export class FormApi<
 
     if (!this.state.canSubmit) return
 
+    const submitMetaArg =
+      submitMeta ?? (this.options.onSubmitMeta as TSubmitMeta)
+
     this.baseStore.setState((d) => ({ ...d, isSubmitting: true }))
 
     const done = () => {
@@ -1785,6 +1790,7 @@ export class FormApi<
       this.options.onSubmitInvalid?.({
         value: this.state.values,
         formApi: this,
+        meta: submitMetaArg,
       })
       return
     }
@@ -1797,6 +1803,7 @@ export class FormApi<
       this.options.onSubmitInvalid?.({
         value: this.state.values,
         formApi: this,
+        meta: submitMetaArg,
       })
       return
     }
@@ -1812,15 +1819,15 @@ export class FormApi<
       )
     })
 
-    this.options.listeners?.onSubmit?.({ formApi: this })
+    this.options.listeners?.onSubmit?.({ formApi: this, meta: submitMetaArg })
 
     try {
       // Run the submit code
       await this.options.onSubmit?.({
         value: this.state.values,
         formApi: this,
-        meta: submitMeta ?? this.options.onSubmitMeta,
-      } as any)
+        meta: submitMetaArg,
+      })
 
       batch(() => {
         this.baseStore.setState((prev) => ({
diff --git a/packages/form-core/tests/FormApi.spec.ts b/packages/form-core/tests/FormApi.spec.ts
@@ -3121,6 +3121,30 @@ describe('form api', () => {
     await form.handleSubmit({ dinosaur: 'Stegosaurus' })
   })
 
+  it('should pass the handleSubmit meta data to onSubmitInvalid', async () => {
+    const form = new FormApi({
+      onSubmitMeta: {} as { dinosaur: string },
+      onSubmitInvalid: async ({ meta }) => {
+        expect(meta.dinosaur).toEqual('Stegosaurus')
+      },
+    })
+
+    await form.handleSubmit({ dinosaur: 'Stegosaurus' })
+  })
+
+  it('should pass the handleSubmit meta data to the onSubmit listener', async () => {
+    const form = new FormApi({
+      onSubmitMeta: {} as { dinosaur: string },
+      listeners: {
+        onSubmit: ({ meta }) => {
+          expect(meta.dinosaur).toEqual('Stegosaurus')
+        },
+      },
+    })
+
+    await form.handleSubmit({ dinosaur: 'Stegosaurus' })
+  })
+
   it('should pass the handleSubmit default meta data to onSubmit', async () => {
     const form = new FormApi({
       onSubmitMeta: { dinosaur: 'Frank' } as { dinosaur: string },
@@ -3132,6 +3156,30 @@ describe('form api', () => {
     await form.handleSubmit()
   })
 
+  it('should pass the handleSubmit default meta data to onSubmitInvalid', async () => {
+    const form = new FormApi({
+      onSubmitMeta: { dinosaur: 'Frank' } as { dinosaur: string },
+      onSubmitInvalid: async ({ meta }) => {
+        expect(meta.dinosaur).toEqual('Frank')
+      },
+    })
+
+    await form.handleSubmit()
+  })
+
+  it('should pass the handleSubmit default meta data to the onSubmit listener', async () => {
+    const form = new FormApi({
+      onSubmitMeta: { dinosaur: 'Frank' } as { dinosaur: string },
+      listeners: {
+        onSubmit: ({ meta }) => {
+          expect(meta.dinosaur).toEqual('Frank')
+        },
+      },
+    })
+
+    await form.handleSubmit()
+  })
+
   it('should read and update union objects', async () => {
     const form = new FormApi({
       defaultValues: {
