FieldErrors are not triggered for invalid inputs after first successful submit

[orenaksakal]

Describe the bug

After successful submission the fielderrors are not triggering for invalid inputs until page reload

Screen.Recording.2024-12-24.at.7.56.36.PM.mov

Reproduction

Easily reproducable with latest formsnap, superforms and shadcnui

+page.svelte

<script lang="ts">
	import { Control, Field, FieldErrors, Label } from 'formsnap';
	import SuperDebug, { superForm } from 'sveltekit-superforms';
	import { zodClient } from 'sveltekit-superforms/adapters';
	import { z } from 'zod';

	import FormButton from '$lib/components/ui/form/form-button.svelte';

	export const schema = z.object({
		email: z.string().min(3, { message: 'Please enter a valid email.' })
	});

	let { data } = $props();

	const form = superForm(data.form, {
		validators: zodClient(schema)
	});
	const { form: formData, enhance } = form;
</script>

<form method="POST" use:enhance>
	<Field {form} name="email">
		<Control>
			{#snippet children({ props })}
				<Label>Email</Label>
				<input {...props} type="email" bind:value={$formData.email} />
			{/snippet}
		</Control>

		<FieldErrors />
	</Field>
	<FormButton class="mt-2 w-full">Submit</FormButton>
</form>

<SuperDebug data={$formData} />

+page.server.ts

import { superValidate } from 'sveltekit-superforms';
import { zod } from 'sveltekit-superforms/adapters';
import { z } from 'zod';

const schema = z.object({
	email: z.string().min(3, { message: 'Please enter a valid email.' })
});

export const load = async () => {
	const form = await superValidate(zod(schema));

	try {
		return {
			form
		};
	} catch (error) {
		console.error(error);
		return {
			form: form
		};
	}
};

export const actions = {
	default: async (event) => {
		const form = await superValidate(event, zod(schema));

		console.log(form);

		return {
			form
		};
	}
};

Logs

No response

System Info

System:
    OS: macOS 15.2
    CPU: (12) arm64 Apple M3 Pro
    Memory: 458.03 MB / 36.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.11.0 - ~/.nvm/versions/node/v22.11.0/bin/node
    npm: 10.9.0 - ~/.nvm/versions/node/v22.11.0/bin/npm
    pnpm: 9.15.1 - ~/Library/pnpm/pnpm
    bun: 1.1.34 - ~/.bun/bin/bun
  Browsers:
    Chrome: 131.0.6778.205

Severity

annoyance

[orenaksakal]

2 more findings

1. If there are multiple forms on same page both forms are having the same problem if one is submitted already.
2. Validated native email validation visible in recording has nothing to do with this

[orenaksakal]

turns out this was discovered earlier in superforms and is a sveltekit bug with a pr hopefully fixing it soon

[huntabyte]

So this isn't caused by Formsnap, correct? @orenaksakal

[orenaksakal]

Correct we can close this if you want or keep it open for other people to track until the fix in sveltekit is merged.

[huntabyte]

We'll close it here! Thanks for investigating!