remotion-dev/remotion · error · Error

Could not serialize the passed input props to JSON: ${(err a

Error message

Could not serialize the passed input props to JSON: ${(err as Error).message}

What it means

Thrown by serializeJSONWithSpecialTypes when the input props contain a value that cannot be round-tripped through its custom JSON serializer (which handles Date, File, and Map/Set but rejects everything else it cannot stringify). The underlying error message is appended so the caller can see which value failed.

Source

Thrown at packages/core/src/input-props-serialization.ts:65

					return value;
				}

				if (
					typeof item === 'string' &&
					staticBase !== null &&
					item.startsWith(staticBase)
				) {
					customFileUsed = true;
					return `${FILE_TOKEN}${item.replace(staticBase + '/', '')}`;
				}

				return value;
			},
			indent,
		);
		return {serializedString, customDateUsed, customFileUsed, mapUsed, setUsed};
	} catch (err) {
		throw new Error(
			'Could not serialize the passed input props to JSON: ' +
				(err as Error).message,
		);
	}
};

export const deserializeJSONWithSpecialTypes = <T = Record<string, unknown>>(
	data: string,
): T => {
	return JSON.parse(data, (_, value) => {
		if (typeof value === 'string' && value.startsWith(DATE_TOKEN)) {
			return new Date(value.replace(DATE_TOKEN, ''));
		}

		if (typeof value === 'string' && value.startsWith(FILE_TOKEN)) {
			return `${window.remotion_staticBase}/${value.replace(FILE_TOKEN, '')}`;
		}

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Inspect the wrapped error message to identify the offending value, then remove or replace it.
  2. Keep inputProps serializable: use plain objects, arrays, numbers, strings, booleans, null, plus Date/File/Map/Set which Remotion supports natively.
  3. Strip functions/refs/class instances before serializing.
  4. Break circular references or avoid passing them as input props.

Example fix

// before: input props include a function
const inputProps = {onClick: () => {}, title: 'Hi'};
serializeInputProps({props: inputProps, ...}); // throws

// after: pass only serializable data
const inputProps = {title: 'Hi'};
Defensive patterns

Strategy: validation

Validate before calling

function isSerializable(v: unknown): boolean {
  if (v === null || typeof v === 'string' || typeof v === 'number' || typeof v === 'boolean') return true;
  if (v instanceof Date || v instanceof File || v instanceof Map || v instanceof Set) return true;
  if (Array.isArray(v)) return v.every(isSerializable);
  if (typeof v === 'object') return Object.values(v as Record<string, unknown>).every(isSerializable);
  return false; // functions, symbols, class instances, circular
}
if (!isSerializable(inputProps)) {
  throw new Error('inputProps contains non-serializable values');
}

Try / catch

try {
  serializeInputProps({props: inputProps, ...});
} catch (err) {
  // err.message names the offending value — strip it from inputProps and retry,
  // or surface a clear validation error to the user.
  console.error('Input props serialization failed:', (err as Error).message);
  throw err;
}

Prevention

When it happens

Trigger: Passing input props that include functions, circular references, symbols, class instances (other than the supported Date/File/Map/Set), or DOM nodes to serializeInputProps.

Common situations: Putting a React element, a ref, a callback, or a non-plain object into inputProps; serializing props for --props on the CLI that were built with class instances.

Related errors


AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12). Data as JSON: /api/errors/9b71d839ca317898. Report an issue: GitHub.