sveltejs/kit · error

Form contained a field that wasn't created with form.fields.

Error message

Form contained a field that wasn't created with form.fields.as(...): ${name}

What it means

SvelteKit form fields created via form.fields.as(...) are serialized with a special 'i:' prefixed, suffixed key encoding their type and metadata. parse_form_key decodes these keys during submission handling; a field name lacking the expected suffix was not produced by form.fields.as(...) and cannot be parsed.

Source

Thrown at packages/kit/src/runtime/form-utils.js:37

/**
 * Separates a form field's path from the metadata encoded in its name.
 * @param {string} form_id
 * @param {string} key
 * @returns {{ name: string; type: 'number' | 'boolean' | null; is_array: boolean }}
 */
export function parse_form_key(form_id, key) {
	const suffix = '/' + form_id;
	let name = key;
	let image_coordinate = '';

	if (name.startsWith('i:') && (name.endsWith(suffix + '.x') || name.endsWith(suffix + '.y'))) {
		image_coordinate = name[name.length - 1];
		name = name.slice(0, -2);
	}

	if (!name.endsWith(suffix)) {
		throw new Error(`Form contained a field that wasn't created with form.fields.as(...): ${name}`);
	}

	name = name.slice(0, -suffix.length);

	/** @type {'number' | 'boolean' | null} */
	let type = null;

	if (name.startsWith('n:')) {
		name = name.slice(2);
		type = 'number';
	} else if (name.startsWith('b:')) {
		name = name.slice(2);
		type = 'boolean';
	} else if (name.startsWith('i:')) {
		name = name.slice(2);
		type = 'number';
	}

View on GitHub (pinned to 03f1687fe6)

Solutions

  1. Create all fields with form.fields.as(...) and use the generated name attributes verbatim.
  2. Remove or rename extra hand-written inputs so they do not collide with library-managed field names, and exclude them from parsing.
  3. Regenerate the form markup after a SvelteKit version upgrade so the encoded field format matches the runtime.

Example fix

// before
<input name="email" />
// after
<input name={fields.email.as('email')} />
Defensive patterns

Strategy: validation

Validate before calling

for (const el of form.elements) {
  if (el.name && !isLibraryManagedName(el.name)) {
    throw new Error(`unmanaged field in enhanced form: ${el.name}`);
  }
}

Try / catch

try {
  await handle_submit(...);
} catch (e) {
  if (e.message.includes("form.fields.as(...):")) {
    return fail(400, { error: 'Form contains unmanaged fields' });
  }
  throw e;
}

Prevention

When it happens

Trigger: Submitting a form containing a raw <input> with a hand-written name attribute mixed with generated fields; a field whose name attribute was manually modified after generation; progressive-enhancement forms posting fields the library didn't create.

Common situations: Adding a hidden input or checkbox by hand to an enhanced form; renaming generated name attributes for styling/testing tools; upgrading SvelteKit so old markup no longer matches the current suffix format.

Related errors


AI-assisted analysis of sveltejs/kit@03f1687fe6 (2026-09-02). Data as JSON: /api/errors/4a5fce4f5a0ace4e. Report an issue: GitHub.