remotion-dev/remotion · error · TypeError
A "duration" of a spring is NaN, which it must not be
Error message
A "duration" of a spring is NaN, which it must not be
What it means
`validateSpringDuration()` rejects `NaN` for the optional `duration` of a spring because a NaN duration produces NaN outputs for every frame and silently breaks the animation. It throws a `TypeError` with a precise description.
Source
Thrown at packages/core/src/validation/validation-spring-duration.ts:13
export const validateSpringDuration = (dur: unknown) => {
if (typeof dur === 'undefined') {
return;
}
if (typeof dur !== 'number') {
throw new TypeError(
`A "duration" of a spring must be a "number" but is "${typeof dur}"`,
);
}
if (Number.isNaN(dur)) {
throw new TypeError(
'A "duration" of a spring is NaN, which it must not be',
);
}
if (!Number.isFinite(dur)) {
throw new TypeError(
'A "duration" of a spring must be finite, but is ' + dur,
);
}
if (dur <= 0) {
throw new TypeError(
'A "duration" of a spring must be positive, but is ' + dur,
);
}
};
View on GitHub (pinned to 78fe4bb3fd)
Solutions
- Validate before calling: `if (duration != null && Number.isNaN(Number(duration))) return;`.
- Default undefined values: `duration: duration ?? undefined` (the validator skips undefined).
- Trace the upstream source of the NaN and fix the arithmetic.
Example fix
// before
spring({frame, fps, config, duration: Number(props.dur)}); // NaN when undefined
// after
spring({frame, fps, config, duration: props.dur == null ? undefined : Number(props.dur)}); Defensive patterns
Strategy: validation
Validate before calling
const duration = rawDuration == null ? undefined : Number(rawDuration); if (duration != null && Number.isNaN(duration)) return;
Type guard
const isValidSpringDuration = (v: unknown): v is number | undefined => v == null || (typeof v === 'number' && !Number.isNaN(v));
Prevention
- Always null-check optional durations before coercion.
- Default missing props to `undefined`, not 0 or NaN.
- Log the resolved duration value before passing to `spring()`.
When it happens
Trigger: Passing `duration: NaN` to `spring()`, typically the result of `Number(undefined)`, `parseInt(undefined)`, or `0/0`.
Common situations: Destructuring `duration` from an optional prop that is not always provided and feeding it straight into `spring()` without an existence check.
Related errors
- Threshold is NaN
- A "duration" of a spring must be a "number" but is "${typeof
- A "duration" of a spring must be finite, but is ${dur}
- A "duration" of a spring must be positive, but is ${dur}
- Threshold is not finite
AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12).
Data as JSON: /api/errors/4d2fc4c8a4abd29e.
Report an issue: GitHub.