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
- Create all fields with form.fields.as(...) and use the generated name attributes verbatim.
- Remove or rename extra hand-written inputs so they do not collide with library-managed field names, and exclude them from parsing.
- 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
- Use form.fields.as(...) for every field in an enhanced form and never hand-write name attributes for managed fields.
- Do not rename generated name attributes for testing tools; select by other attributes instead.
- Regenerate form markup after SvelteKit upgrades.
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
- The SvelteKit Vite plugin ${keypath} should be an object wit
- `redirect` options.external must be `true` or an array of al
- use:enhance can only be used on <form> fields with method="P
- Your form contains <input type="file"> fields, but is missin
- refreshAll() is invalid for live queries. Use reconnectAll()
AI-assisted analysis of sveltejs/kit@03f1687fe6 (2026-09-02).
Data as JSON: /api/errors/4a5fce4f5a0ace4e.
Report an issue: GitHub.