remotion-dev/remotion · error · TypeError

You passed in a function to the volume prop but it returned

Error message

You passed in a function to the volume prop but it returned NaN for frame ${frame}.

What it means

TypeError thrown by `evaluateVolume` when the volume callback returns a value that is a number type but is NaN (after multiplying by mediaVolume). NaN typically arises from arithmetic on undefined/NaN inputs, `0/0`, or `parseInt` on a non-numeric string. The offending frame is included in the message so the developer can reproduce.

Source

Thrown at packages/core/src/volume-prop.ts:28

	mediaVolume: number;
}): number => {
	if (typeof volume === 'number') {
		return volume * mediaVolume;
	}

	if (typeof volume === 'undefined') {
		return Number(mediaVolume);
	}

	const evaluated = volume(frame) * mediaVolume;
	if (typeof evaluated !== 'number') {
		throw new TypeError(
			`You passed in a a function to the volume prop but it did not return a number but a value of type ${typeof evaluated} for frame ${frame}`,
		);
	}

	if (Number.isNaN(evaluated)) {
		throw new TypeError(
			`You passed in a function to the volume prop but it returned NaN for frame ${frame}.`,
		);
	}

	if (!Number.isFinite(evaluated)) {
		throw new TypeError(
			`You passed in a function to the volume prop but it returned a non-finite number for frame ${frame}.`,
		);
	}

	return Math.max(0, evaluated);
};

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Guard divisions: `b === 0 ? 0 : a / b`.
2. Default NaN-producing inputs with `|| 0` or `?? 0`.
3. Wrap the callback body with `const v = compute(); return Number.isNaN(v) ? 0 : v;`.

Example fix

// before
<Video src={s} volume={(f) => f / duration} /> // duration=0 -> NaN at f=0

// after
<Video src={s} volume={(f) => (duration === 0 ? 0 : f / duration)} />

const safeVolume = (v: (f: number) => number, frames: number[]) => {
  for (const f of frames) {
    if (Number.isNaN(v(f))) throw new Error(`volume NaN at frame ${f}`);
  }
};

const returnsNoNaN = (v: (f: number) => number, f: number): boolean =>
  !Number.isNaN(v(f));

When it happens

Trigger: A volume function that computes `a / b` where b can be 0, `Math.log(negative)`, arithmetic on an undefined variable, or `Number(undefined)`. For at least one frame the result is NaN.

Common situations: Fade curves that divide by a duration that is 0 on the first frame; looking up a value in an array with an out-of-range index producing undefined then multiplying; parsing user-supplied numeric strings that are occasionally empty.

Related errors

• You have passed a volume of type ${typeof props.volume} to y
• You have passed a volume below 0 to your <${component} /> co
• You have passed a playbackRate of ${props.playbackRate} to y
• You passed in a a function to the volume prop but it did not
• You passed in a function to the volume prop but it returned

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