From dc822f79032cb99f0499439fd867a04724fb0d5c Mon Sep 17 00:00:00 2001
From: Stephen Haberman <shaberman@homebound.com>
Date: Fri, 15 Dec 2023 10:32:50 -0600
Subject: [PATCH] feat: console.debug when auto saves are skipped. (#105)

It can be really frustrating to wonder "wtf is this not working", and
previously the fix was to "know where to go in the form-state source to
set the break point an examine the form". :-|
---
 src/useFormState.ts  | 7 ++++++-
 src/useFormStates.ts | 9 +++++++--
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/useFormState.ts b/src/useFormState.ts
index 221f962..ab3fc1f 100644
--- a/src/useFormState.ts
+++ b/src/useFormState.ts
@@ -114,7 +114,12 @@ export function useFormState<T, I>(opts: UseFormStateOpts<T, I>): ObjectState<T>
         }
 
         // Don't use canSave() because we don't want to set touched for all the fields
-        if (autoSaveRef.current && form.dirty && form.valid && !isAutoSaving) {
+        if (autoSaveRef.current && form.dirty && !isAutoSaving) {
+          // It's very frustrating to not know why the form is savings, to go ahead and log these
+          if (!form.valid) {
+            console.debug("Skipping auto-save b/c form is invalid: ", form.errors);
+            return;
+          }
           isAutoSaving = "queued";
           let maybeError: undefined | string;
           // We use setTimeout as a cheap way to wait until the end of the current event listener
diff --git a/src/useFormStates.ts b/src/useFormStates.ts
index f163479..bb9c7c7 100644
--- a/src/useFormStates.ts
+++ b/src/useFormStates.ts
@@ -97,8 +97,13 @@ export function useFormStates<T, I = T>(opts: UseFormStatesOpts<T, I>): UseFormS
       let form = existing?.[0];
 
       async function maybeAutoSave(form: ObjectState<T>) {
-        // Don't use canSave() because we don't want to set touched for all the fields
-        if (autoSaveRef.current && form.dirty && form.valid) {
+        // Don't use form.canSave() because we don't want to set touched for all the fields
+        if (autoSaveRef.current && form.dirty) {
+          // It's very frustrating to not know why the form is savings, to go ahead and log these
+          if (!form.valid) {
+            console.debug("Skipping auto-save b/c form is invalid: ", form.errors);
+            return;
+          }
           const { current: pending } = pendingAutoSaves;
           if (isAutoSaving) {
             pending.add(form);