Added checkbox crash test

Author: ciscoheat

src/routes/(v2)/Navigation.svelte

@@ -25,6 +25,7 @@
 		<li><a href="/v2/oninput-errors">oninput error display</a></li>
 		<li><a href="/v2/multistep-client">Multi-step client</a></li>
 		<li><a href="/v2/multistep-server">Multi-step server</a></li>
+		<li><a href="/v2/issue-345">Checkbox crash</a></li>
 	</ul>
 </nav>
 

src/routes/(v2)/v2/issue-345/+page.server.ts

@@ -0,0 +1,21 @@
+import { superValidate, message } from '$lib/index.js';
+import { zod } from '$lib/adapters/zod.js';
+import { fail } from '@sveltejs/kit';
+import { schema } from './schema.js';
+
+export const load = async () => {
+	console.log('Loading...');
+	const form = await superValidate(zod(schema));
+	return { form };
+};
+
+export const actions = {
+	default: async ({ request }) => {
+		const form = await superValidate(request, zod(schema));
+		console.log(form);
+
+		if (!form.valid) return fail(400, { form });
+
+		return message(form, 'Form posted successfully!');
+	}
+};

src/routes/(v2)/v2/issue-345/+page.svelte

@@ -0,0 +1,74 @@
+<script lang="ts">
+	import { page } from '$app/stores';
+	import { superForm } from '$lib/index.js';
+	import SuperDebug from '$lib/index.js';
+	import CheckboxComponent from './CheckboxComponent.svelte';
+	import CheckboxField from './CheckboxField.svelte';
+
+	export let data;
+
+	const form = superForm(data.form, { taintedMessage: false });
+
+	const { form: formStore, errors, message, constraints, enhance } = form;
+</script>
+
+<SuperDebug data={$formStore} />
+
+<h3>Superforms testing ground - Zod</h3>
+
+{#if $message}
+	<div class="status" class:error={$page.status >= 400} class:success={$page.status == 200}>
+		{$message}
+	</div>
+{/if}
+
+<form method="POST" use:enhance>
+	<CheckboxComponent bind:checked={$formStore.checkbox} />
+
+	<!-- Comment the above line, uncomment this line, and reload to cause the failure on SSR (infinite loop). -->
+	<!-- CheckboxField {form} field="checkbox" description="checkbox" / -->
+
+	<button>Submit</button>
+</form>
+
+<hr />
+<p><a target="_blank" href="https://superforms.rocks/api">API Reference</a></p>
+
+<style>
+	.invalid {
+		color: red;
+	}
+
+	.status {
+		color: white;
+		padding: 4px;
+		padding-left: 8px;
+		border-radius: 2px;
+		font-weight: 500;
+	}
+
+	.status.success {
+		background-color: seagreen;
+	}
+
+	.status.error {
+		background-color: #ff2a02;
+	}
+
+	input {
+		background-color: #ddd;
+	}
+
+	a {
+		text-decoration: underline;
+	}
+
+	hr {
+		margin-top: 4rem;
+	}
+
+	form {
+		padding-top: 1rem;
+		padding-bottom: 1rem;
+	}
+</style>

src/routes/(v2)/v2/issue-345/CheckboxComponent.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  export let checked = false;
+</script>
+
+<input type="checkbox" bind:checked {...$$restProps} />

src/routes/(v2)/v2/issue-345/CheckboxField.svelte

@@ -0,0 +1,19 @@
+<script lang="ts" context="module">
+	type UnknownRecord = Record<string, unknown>;
+
+	type T = UnknownRecord;
+</script>
+
+<script lang="ts" generics="T extends UnknownRecord">
+	import type { Writable } from 'svelte/store';
+	import type { FormPathLeaves } from '$lib/index.js';
+	import { formFieldProxy, type SuperForm } from '$lib/index.js';
+	import CheckboxComponent from './CheckboxComponent.svelte';
+	export let form: SuperForm<T>;
+	export let field: FormPathLeaves<T>;
+
+	const { value, errors } = formFieldProxy(form, field);
+	$: boolValue = value as Writable<boolean>;
+</script>
+
+<CheckboxComponent bind:checked={$boolValue} />

src/routes/(v2)/v2/issue-345/schema.ts

@@ -0,0 +1,5 @@
+import { z } from 'zod';
+
+export const schema = z.object({
+	checkbox: z.boolean().optional()
+});