Discriminated unions for the form itself weren't including the union keys for the schema, when parsing the form data.

Author: ciscoheat

CHANGELOG.md

@@ -11,6 +11,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - `FormPath` now extends only basic objects and arrays, avoiding issues with classes, built-in objects like `File` and `Date`, and special "branded" types that validation libraries are using. Thanks to [Matt DeKok](https://github.com/sillvva) for this fix!
 - [SuperDebug](https://superforms.rocks/super-debug) always renders left-to-right now.
+- Discriminated unions for the form itself weren't including the union keys for the schema, when parsing the form data.
 
 ## [2.13.0] - 2024-05-03
 

src/lib/formData.ts

@@ -153,14 +153,32 @@ function _parseFormData<T extends Record<string, unknown>>(
 	options?: SuperValidateOptions<T>
 ) {
 	const output: Record<string, unknown> = {};
-	const schemaKeys = options?.strict
-		? new Set([...formData.keys()].filter((key) => !key.startsWith('__superform_')))
-		: new Set(
-				[
-					...Object.keys(schema.properties ?? {}),
-					...(schema.additionalProperties ? formData.keys() : [])
-				].filter((key) => !key.startsWith('__superform_'))
-			);
+
+	let schemaKeys: Set<string>;
+
+	if (options?.strict) {
+		schemaKeys = new Set([...formData.keys()].filter((key) => !key.startsWith('__superform_')));
+	} else {
+		let unionKeys: string[] = [];
+
+		// Special fix for union schemas, then the keys must be gathered from the objects in the union
+		if (schema.anyOf) {
+			const info = schemaInfo(schema, false, []);
+			if (info.union?.some((s) => s.type !== 'object')) {
+				throw new SchemaError('All form types must be an object if schema is a union.');
+			}
+
+			unionKeys = info.union?.flatMap((s) => Object.keys(s.properties ?? {})) ?? [];
+		}
+
+		schemaKeys = new Set(
+			[
+				...unionKeys,
+				...Object.keys(schema.properties ?? {}),
+				...(schema.additionalProperties ? formData.keys() : [])
+			].filter((key) => !key.startsWith('__superform_'))
+		);
+	}
 
 	function parseSingleEntry(key: string, entry: FormDataEntryValue, info: SchemaInfo) {
 		if (options?.preprocessed && options.preprocessed.includes(key as keyof T)) {
@@ -243,6 +261,8 @@ function parseFormDataEntry(
 	type: Exclude<SchemaType, 'null'>,
 	info: SchemaInfo
 ): unknown {
+	//console.log(`Parsing FormData ${key} (${type}): "${value}"`, info); //debug
+
 	if (!value) {
 		//console.log(`No FormData for "${key}" (${type}).`, info); //debug
 

src/routes/(v2)/v2/Navigation.svelte

@@ -59,7 +59,8 @@
 		'form-result-type',
 		'nested-traverse',
 		'reset-errors',
-		'schemasafe-types'
+		'schemasafe-types',
+		'discriminated-union'
 	].sort();
 </script>
 

src/routes/(v2)/v2/discriminated-union/+page.server.ts

@@ -0,0 +1,23 @@
+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 () => {
+	const adapter = zod(schema);
+	console.dir(adapter.jsonSchema, { depth: 10 }); //debug
+	const form = await superValidate(adapter);
+	return { form };
+};
+
+export const actions = {
+	default: async ({ request }) => {
+		const formdata = await request.formData();
+		const form = await superValidate(formdata, zod(schema));
+		console.log(form, formdata);
+
+		if (!form.valid) return fail(400, { form });
+
+		return message(form, 'Form posted successfully!');
+	}
+};

src/routes/(v2)/v2/discriminated-union/+page.svelte

@@ -0,0 +1,82 @@
+<script lang="ts">
+	import { page } from '$app/stores';
+	import { superForm } from '$lib/index.js';
+	import SuperDebug from '$lib/index.js';
+
+	export let data;
+
+	const { form, errors, message, enhance } = superForm(data.form, {
+		taintedMessage: null,
+		resetForm: true
+	});
+
+	// eslint-disable-next-line svelte/valid-compile
+	$page;
+</script>
+
+<SuperDebug data={$form} />
+
+<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>
+	<label>
+		Type<br />
+		<input
+			name="type"
+			type="text"
+			aria-invalid={$errors.type ? 'true' : undefined}
+			bind:value={$form.type}
+		/>
+		{#if $errors.type}<span class="invalid">{$errors.type}</span>{/if}
+	</label>
+
+	<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/discriminated-union/schema.ts

@@ -0,0 +1,11 @@
+import { z } from 'zod';
+
+export const schema = z.discriminatedUnion('type', [
+	z.object({
+		type: z.literal('empty')
+	}),
+	z.object({
+		type: z.literal('extra'),
+		roleId: z.string()
+	})
+]);

src/tests/superValidate.test.ts

@@ -301,7 +301,6 @@ describe('Schemasafe', () => {
 
 		const adapter = schemasafe(schema);
 		const form = await superValidate(request, adapter);
-		console.log('🚀 ~ it ~ form:', form);
 		const email: string = form.data.email;
 
 		assert(!form.valid);
@@ -1110,6 +1109,56 @@ describe('Array validation', () => {
 	});
 });
 
+describe('Top-level union', () => {
+	it('should handle unions on the top-level', async () => {
+		/*
+		const schema: JSONSchema7 = {
+			anyOf: [
+				{
+					type: 'object',
+					properties: { type: { type: 'string', const: 'empty' } },
+					required: ['type'],
+					additionalProperties: false
+				},
+				{
+					type: 'object',
+					properties: {
+						type: { type: 'string', const: 'extra' },
+						roleId: { type: 'string' }
+					},
+					required: ['type', 'roleId'],
+					additionalProperties: false
+				}
+			],
+			$schema: 'http://json-schema.org/draft-07/schema#'
+		};
+		*/
+
+		const schema = z.discriminatedUnion('type', [
+			z.object({
+				type: z.literal('empty')
+			}),
+			z.object({
+				type: z.literal('extra'),
+				roleId: z.string()
+			})
+		]);
+
+		const formData = new FormData();
+		formData.set('type', 'extra');
+		formData.set('roleId', 'ABC');
+
+		const form = await superValidate(formData, zod(schema));
+		//console.log('🚀 ~ it ~ form:', form);
+
+		assert(form.valid);
+		assert(form.data.type == 'extra');
+
+		const roleId: string = form.data.roleId;
+		expect(roleId).toBe('ABC');
+	});
+});
+
 describe('Enum validation', () => {
 	const fishes = ['trout', 'tuna', 'shark'] as const;