fix(core): ignore stale form submit attempts

Author: RtlZeroMemory

CHANGELOG.md

@@ -6,6 +6,14 @@ The format is based on Keep a Changelog and the project follows Semantic Version
 
 ## [Unreleased]
 
+### Bug Fixes
+
+- `useForm` now ignores late async validation results and submit rejections after `reset()` cancels a pending submit attempt, keeping reset state authoritative.
+
+### Tests
+
+- Added `useForm` regressions covering reset during pending submit rejection and reset during pending async-submit validation completion.
+
 ## [0.1.0-alpha.60] - 2026-03-14
 
 ### Bug Fixes

packages/core/src/forms/__tests__/form.async-validation.test.ts

@@ -479,6 +479,68 @@ describe("form.async-validation - useForm behavior", () => {
     assert.equal(form.isSubmitting, false);
   });
 
+  test("reset ignores late async validation errors from a canceled submit attempt", async () => {
+    const h = createFormHarness();
+    const validation = createDeferred<ValidationResult<Values>>();
+    let submitCalls = 0;
+    const opts = options({
+      validateOnChange: false,
+      validate: () => ({}),
+      validateAsync: async () => validation.promise,
+      onSubmit: () => {
+        submitCalls++;
+      },
+    });
+
+    let form = h.render(opts);
+    form.handleSubmit();
+    await flushMicrotasks();
+    form = h.render(opts);
+    assert.equal(form.isSubmitting, true);
+
+    form.reset();
+    form = h.render(opts);
+    assert.equal(form.isSubmitting, false);
+    assert.deepEqual(form.errors, {});
+
+    validation.resolve({ email: "taken" });
+    await flushMicrotasks(4);
+    form = h.render(opts);
+
+    assert.equal(form.isSubmitting, false);
+    assert.deepEqual(form.errors, {});
+    assert.equal(form.submitError, undefined);
+    assert.equal(submitCalls, 0);
+  });
+
+  test("reset ignores late async validation rejection from a canceled submit attempt", async () => {
+    const h = createFormHarness();
+    const validation = createDeferred<ValidationResult<Values>>();
+    const opts = options({
+      validateOnChange: false,
+      validate: () => ({}),
+      validateAsync: async () => validation.promise,
+    });
+
+    let form = h.render(opts);
+    form.handleSubmit();
+    await flushMicrotasks();
+    form = h.render(opts);
+    assert.equal(form.isSubmitting, true);
+
+    form.reset();
+    form = h.render(opts);
+    assert.equal(form.isSubmitting, false);
+
+    validation.reject(new Error("offline"));
+    await flushMicrotasks(4);
+    form = h.render(opts);
+
+    assert.equal(form.isSubmitting, false);
+    assert.equal(form.submitError, undefined);
+    assert.deepEqual(form.errors, {});
+  });
+
   test("handleSubmit rejects concurrent submits while pending", async () => {
     const h = createFormHarness();
     const submit = createDeferred<void>();

packages/core/src/forms/__tests__/form.state.test.ts

@@ -346,6 +346,43 @@ describe("form.state - submit and reset lifecycle", () => {
     await flushMicrotasks();
     form = h.render(opts);
     assert.equal(form.isSubmitting, false);
+    assert.deepEqual(form.values, { name: "Ada", email: "ada@example.com", age: 42 });
+    assert.equal(form.submitError, undefined);
+  });
+
+  test("reset ignores late submit rejection from a canceled attempt", async () => {
+    const h = createFormHarness();
+    const submit = createDeferred<void>();
+    const submitError = new Error("submit failed");
+    const captured: unknown[] = [];
+    const opts = options({
+      onSubmit: async () => submit.promise,
+      onSubmitError: (error) => {
+        captured.push(error);
+      },
+    });
+
+    let form = h.render(opts);
+    form.setFieldValue("name", "Changed");
+    form = h.render(opts);
+    form.handleSubmit();
+    await flushMicrotasks();
+    form = h.render(opts);
+    assert.equal(form.isSubmitting, true);
+
+    form.reset();
+    form = h.render(opts);
+    assert.equal(form.isSubmitting, false);
+    assert.deepEqual(form.values, { name: "Ada", email: "ada@example.com", age: 42 });
+
+    submit.reject(submitError);
+    await flushMicrotasks(4);
+    form = h.render(opts);
+
+    assert.equal(form.isSubmitting, false);
+    assert.equal(form.submitError, undefined);
+    assert.deepEqual(form.values, { name: "Ada", email: "ada@example.com", age: 42 });
+    assert.deepEqual(captured, []);
   });
 
   test("resetOnSubmit restores initial values after successful submit", async () => {

packages/core/src/forms/internal/submit.ts

@@ -17,6 +17,8 @@ type AsyncValidatorRef<T extends Record<string, unknown>> = {
     | undefined;
 };
 
+type AttemptRef = { current: number };
+
 function markAllFieldsTouched<T extends Record<string, unknown>>(
   values: T,
 ): Partial<Record<keyof T, FieldBooleanValue>> {
@@ -32,11 +34,13 @@ function markAllFieldsTouched<T extends Record<string, unknown>>(
 export function createResetAction<T extends Record<string, unknown>>(options: {
   formOptions: UseFormOptions<T>;
   asyncValidatorRef: AsyncValidatorRef<T>;
+  attemptRef: AttemptRef;
   submittingRef: { current: boolean };
   fieldArrayKeysRef: { current: Partial<Record<keyof T, string[]>> };
   updateFormState: UpdateFormState<T>;
 }): () => void {
   return (): void => {
+    options.attemptRef.current += 1;
     options.submittingRef.current = false;
     options.asyncValidatorRef.current?.cancel();
     options.fieldArrayKeysRef.current = {};
@@ -51,6 +55,7 @@ export function createSubmitAction<T extends Record<string, unknown>>(options: {
   stateRef: { current: FormState<T> };
   submittingRef: { current: boolean };
   asyncValidatorRef: AsyncValidatorRef<T>;
+  attemptRef: AttemptRef;
   updateFormState: UpdateFormState<T>;
   runSyncValidationFiltered: (
     values: T,
@@ -94,8 +99,14 @@ export function createSubmitAction<T extends Record<string, unknown>>(options: {
       options.submittingRef.current = false;
       return;
     }
+    const attempt = options.attemptRef.current + 1;
+    options.attemptRef.current = attempt;
     const submitValues = cloneInitialValues(snapshot.values);
+    const isStaleAttempt = (): boolean => options.attemptRef.current !== attempt;
     const failSubmit = (error: unknown): void => {
+      if (isStaleAttempt()) {
+        return;
+      }
       if (typeof options.formOptions.onSubmitError === "function") {
         try {
           options.formOptions.onSubmitError(error);
@@ -115,6 +126,9 @@ export function createSubmitAction<T extends Record<string, unknown>>(options: {
     };
 
     const finishSuccessfulSubmit = (): void => {
+      if (isStaleAttempt()) {
+        return;
+      }
       if (options.formOptions.resetOnSubmit) {
         options.reset();
         return;
@@ -176,6 +190,9 @@ export function createSubmitAction<T extends Record<string, unknown>>(options: {
     void (async () => {
       try {
         const asyncErrors = await options.runAsyncValidationFiltered(submitValues, snapshot);
+        if (isStaleAttempt()) {
+          return;
+        }
         const allErrors = mergeValidationErrors(syncErrors, asyncErrors);
         if (!isValidationClean(allErrors)) {
           options.submittingRef.current = false;
@@ -189,6 +206,9 @@ export function createSubmitAction<T extends Record<string, unknown>>(options: {
         }
         await runSubmitCallback();
       } catch (error) {
+        if (isStaleAttempt()) {
+          return;
+        }
         options.submittingRef.current = false;
         options.updateFormState((prev) => ({
           ...prev,

packages/core/src/forms/useForm.ts

@@ -47,6 +47,7 @@ export function useForm<T extends Record<string, unknown>, State = void>(
 
   const pendingAsyncValuesRef = ctx.useRef<T | null>(null);
   const submittingRef = ctx.useRef(false);
+  const submitAttemptRef = ctx.useRef(0);
   const validateRef = ctx.useRef(options.validate);
   validateRef.current = options.validate;
   const nonTextBindingWarningsRef = ctx.useRef<Set<string>>(new Set());
@@ -192,6 +193,7 @@ export function useForm<T extends Record<string, unknown>, State = void>(
   const reset = createResetAction({
     formOptions: options,
     asyncValidatorRef,
+    attemptRef: submitAttemptRef,
     submittingRef,
     fieldArrayKeysRef,
     updateFormState,
@@ -204,6 +206,7 @@ export function useForm<T extends Record<string, unknown>, State = void>(
     stateRef,
     submittingRef,
     asyncValidatorRef,
+    attemptRef: submitAttemptRef,
     updateFormState,
     runSyncValidationFiltered,
     runAsyncValidationFiltered,