I've started a new project using svelte kit with svelte 5. I opted for shadcn-svelte and build a simple login form with superforms.
<script lang="ts"> import type {PageData} from "./$types"; import {FormField, FormControl, FormLabel, FormButton, FormFieldErrors} from "$lib/components/ui/form"; import {superForm} from "sveltekit-superforms"; import {zodClient} from "sveltekit-superforms/adapters"; import {formSchema} from "./schema.js"; import {Input} from "$lib/components/ui/input"; import {LoaderCircle} from 'lucide-svelte'; import {Button} from "$lib/components/ui/button"; let {data} = $props(); let form = superForm(data.form, { validators: zodClient(formSchema) }); const {form: formData, enhance, submitting} = form;</script><form action="?/login" method="post" use:enhance><FormField form={form} name="email"><FormControl> {#snippet children({props})}<FormLabel>Email</FormLabel><Input {...props} bind:value={$formData.email} /> {/snippet}</FormControl><FormFieldErrors /></FormField><FormField {form} name="password"><FormControl> {#snippet children({props})}<FormLabel>Password</FormLabel><Input type="password" {...props} bind:value={$formData.password} /> {/snippet}</FormControl><FormFieldErrors /></FormField><Button type="submit" disabled={$submitting}> {#if ($submitting)}<LoaderCircle class="mr-2 h-4 w-4 animate-spin" /> {/if} Sign in with email</Button></form>When I send down an error message from the load function with setError(form, 'email', "Message"); it does not appear in the login screen. When I disable progressive enhancement it works?! What am I doing wrong.
When I look in the dev menu, I see that the request was successful and the error message was sent down, but it won't be rendered.
Also, when I hot reload the app, when a message should be shown, it randomly appears.