remotion-dev/remotion · error · TypeError

The "trimBefore" prop of <Sequence /> must be a real…

Error message

The "trimBefore" prop of <Sequence /> must be a real number, but it is NaN.

What it means

Thrown when trimBefore is the literal NaN. Because the prior check (trimBefore < 0) is false for NaN, this guard catches the case explicitly before the finite check. Passing NaN corrupts frame math silently, so it is rejected.

Solutions

  1. Use Number.isFinite(trimBefore) before passing the prop.
  2. Fall back to a default when parsing fails: const tb = Number(raw); if (!Number.isFinite(tb)) tb = 0.
  3. Validate upstream data shape at the config loader.

Example fix

// before
const trimBefore = parseInt(config.trim, 10);
<Sequence trimBefore={trimBefore} />

// after
const trimBefore = Number(config.trim);
<Sequence trimBefore={Number.isFinite(trimBefore) ? trimBefore : 0} />
Defensive patterns

Strategy: validation

Validate before calling

if (!Number.isFinite(trimBefore)) {
  trimBefore = 0;
}

Type guard

const isRealNumber = (v: unknown): v is number =>
  typeof v === 'number' && !Number.isNaN(v);

Prevention

When it happens

Trigger: trimBefore is the result of Number(undefined), parseInt(nonNumericString), 0/0, or Math.sqrt(-1).

Common situations: Parsing a missing or malformed trimBefore field from config; arithmetic on undefined variables; parseFloat returning NaN on empty strings.

Related errors


AI-assisted analysis of remotion-dev/remotion@b2f4e34732 (2026-08-12). Data as JSON: /api/errors/612b0398ea74f0a8. Report an issue: GitHub.

Appendix: source

Thrown at packages/core/src/Sequence.tsx:247

		throw new TypeError(
			`The "from" prop of a sequence must be finite, but got ${from}.`,
		);
	}

	if (typeof trimBefore !== 'number') {
		throw new TypeError(
			`You passed to the "trimBefore" prop of your <Sequence> an argument of type ${typeof trimBefore}, but it must be a number.`,
		);
	}

	if (trimBefore < 0) {
		throw new TypeError(
			`The "trimBefore" prop of <Sequence /> must be greater than or equal to 0, but got ${trimBefore}.`,
		);
	}

	if (Number.isNaN(trimBefore)) {
		throw new TypeError(
			'The "trimBefore" prop of <Sequence /> must be a real number, but it is NaN.',
		);
	}

	if (!Number.isFinite(trimBefore)) {
		throw new TypeError(
			`The "trimBefore" prop of <Sequence /> must be finite, but it is ${trimBefore}.`,
		);
	}

	if (typeof freeze !== 'undefined' && freeze !== null) {
		if (typeof freeze !== 'number') {
			throw new TypeError(
				`The "freeze" prop of <Sequence /> must be a number, but is of type ${typeof freeze}.`,
			);
		}

		if (Number.isNaN(freeze)) {

View on GitHub (pinned to b2f4e34732)