schemasafe test

Author: ciscoheat

src/routes/(v2)/v2/schemasafe-types/+page.server.ts

@@ -12,10 +12,12 @@ export const load = async () => {
 
 export const actions = {
 	default: async ({ request }) => {
+		const formData = await request.formData();
+
 		const adapter = schemasafe(schema);
 		const adapter2 = schemasafe(constSchema);
-		const form = await superValidate(request, adapter);
-		const form2 = await superValidate(request, adapter2);
+		const form = await superValidate(formData, adapter);
+		const form2 = await superValidate(formData, adapter2);
 
 		if (!form.valid || !form2.valid) {
 			return fail(400, { form });

src/routes/(v2)/v2/schemasafe-types/+page.svelte

@@ -5,20 +5,33 @@
 
 	export let data;
 
-	const { form } = superForm(data.form);
+	const { form, errors, enhance } = superForm(data.form, { taintedMessage: null });
 	const { form: form2 } = superForm(data.constForm, {
-		validators: schemasafeClient(schema)
+		validators: schemasafeClient(schema),
+		taintedMessage: null
 	});
-	const name: unknown = $form.name;
-	const name2: string = $form2.name;
+	$: name = $form.name;
+	$: name2 = $form2.name;
 </script>
 
-<form method="POST">
-	<label for="name">Name ({name} {name2})</label>
-	<input type="text" name="name" bind:value={$form.name} />
+<form method="POST" use:enhance>
+	<label for="name">Name ({name}{name2})</label>
+	<input
+		type="text"
+		name="name"
+		bind:value={$form.name}
+		aria-invalid={$errors.name ? 'true' : undefined}
+	/>
+	{#if $errors.name}{$errors.name}{/if}
 
 	<label for="email">E-mail</label>
-	<input type="email" name="email" bind:value={$form.email} />
+	<input
+		type="email"
+		name="email"
+		bind:value={$form.email}
+		aria-invalid={$errors.email ? 'true' : undefined}
+	/>
+	{#if $errors.email}{$errors.email}{/if}
 
 	<div><button>Submit</button></div>
 </form>

src/routes/(v2)/v2/schemasafe-types/schema.ts

@@ -4,7 +4,7 @@ import type { JSONSchema } from 'sveltekit-superforms';
 export const schema = {
 	type: 'object',
 	properties: {
-		name: { type: 'string', default: 'Hello world!' },
+		name: { type: 'string', default: '', minLength: 3 },
 		email: { type: 'string', format: 'email' }
 	},
 	required: ['email'],
@@ -15,7 +15,7 @@ export const schema = {
 export const constSchema = {
 	type: 'object',
 	properties: {
-		name: { type: 'string', default: 'Hello world!' },
+		name: { type: 'string', default: '', minLength: 3 },
 		email: { type: 'string', format: 'email' }
 	},
 	required: ['email'],