Schema transformations weren't updating the form data on the client.

Author: ciscoheat

CHANGELOG.md

@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - Tainted fields were set to undefined when not needed, unnecessarily triggering client-side validation.
+- Schema transformations weren't updating the form data on the client. ([#298](https://github.com/ciscoheat/sveltekit-superforms/issues/298))
 
 ## [1.11.0] - 2023-11-28
 

src/lib/client/clientValidation.ts

@@ -224,7 +224,7 @@ async function _clientValidation<T extends AnyZodObject, M = unknown>(
  */
 export async function validateObjectErrors<T extends AnyZodObject, M>(
   formOptions: FormOptions<T, M>,
-  data: z.infer<T>,
+  Form: SuperForm<T, M>['form'],
   Errors: SuperForm<T, M>['errors'],
   tainted: TaintedFields<UnwrapEffects<T>> | undefined
 ) {
@@ -236,7 +236,7 @@ export async function validateObjectErrors<T extends AnyZodObject, M>(
   }
 
   const validators = formOptions.validators as AnyZodObject;
-  const result = await validators.safeParseAsync(data);
+  const result = await validators.safeParseAsync(get(Form));
 
   if (!result.success) {
     const newErrors = mapErrors(
@@ -281,13 +281,15 @@ export async function validateObjectErrors<T extends AnyZodObject, M>(
       });
       return currentErrors;
     });
+    // Disable if form values shouldn't be updated immediately:
+    if (result.data) Form.set(result.data);
   }
 }
 
 type ValidationResult<T extends ZodValidation<AnyZodObject>> = {
   validated: boolean | 'all';
   errors: string[] | undefined;
-  data: SuperForm<T, unknown>['form'] | undefined;
+  data: z.infer<T> | undefined;
 };
 
 /**
@@ -344,7 +346,7 @@ export async function validateField<
     return errorMsgs ?? undefined;
   }
 
-  const errors = await _validateField(
+  const result = await _validateField(
     path,
     formOptions.validators,
     data,
@@ -353,25 +355,25 @@ export async function validateField<
     options
   );
 
-  if (errors.validated) {
-    if (errors.validated === 'all' && !errors.errors) {
+  if (result.validated) {
+    if (result.validated === 'all' && !result.errors) {
       // We validated the whole data structure, so clear all errors on success after delayed validators.
       // it will also set the current path to undefined, so it can be used in
       // the tainted+error check in oninput.
       Errors_clear();
     } else {
-      errors.errors = Errors_update(errors.errors);
-      return errors;
+      result.errors = Errors_update(result.errors);
     }
   } else if (
-    errors.validated === false &&
+    result.validated === false &&
     formOptions.defaultValidator == 'clear'
   ) {
-    errors.errors = Errors_update(errors.errors);
-    return errors;
+    result.errors = Errors_update(result.errors);
   }
 
-  return errors;
+  if (result.data) data.set(result.data, options);
+
+  return result;
 }
 
 // @DCI-context

src/lib/client/index.ts

@@ -749,12 +749,7 @@ export function superForm<
           updated = updated || (await Tainted__validate(path, taintOptions));
         }
         if (!updated) {
-          await validateObjectErrors(
-            options,
-            get(Form),
-            Errors,
-            get(Tainted)
-          );
+          await validateObjectErrors(options, Form, Errors, get(Tainted));
         }
       }
     }

src/routes/tests/issue-298/+page.svelte

@@ -0,0 +1,45 @@
+<script lang="ts">
+  import { z } from 'zod';
+  import { superForm as _superForm } from '$lib/client';
+  import { superValidateSync } from '$lib/client';
+  import SuperDebug from '$lib/client/SuperDebug.svelte';
+
+  export const timePatternSchema = z.object({
+    recurrenceRuleSets: z
+      .object({
+        endType: z.enum(['never', 'date', 'after']),
+        rrule: z.string()
+      })
+      .transform((value) => {
+        let newRrule = 'after';
+        console.log({ ...value, rrule: newRrule });
+        return { ...value, rrule: newRrule };
+      })
+  });
+
+  const superForm = _superForm(superValidateSync(timePatternSchema), {
+    SPA: true,
+    dataType: 'json',
+    validators: timePatternSchema,
+    taintedMessage: null
+  });
+
+  $: ({ form } = superForm);
+</script>
+
+<SuperDebug data={$form} />
+
+<form use:superForm.enhance method="post">
+  {#each ['never', 'date', 'after'] as item}
+    <div>
+      <input
+        value={item}
+        bind:group={$form.recurrenceRuleSets.endType}
+        type="radio"
+        id={item}
+        name={item}
+      />
+      {item}
+    </div>
+  {/each}
+</form>