remotion-dev/remotion · error · TypeError

"${name}" must be an integer, but got ${JSON.stringify(value

Error message

"${name}" must be an integer, but got ${JSON.stringify(value)}

What it means

The noiseDisplacement() effect's optional `passes` prop (number of source samples along the displacement path) must be an integer if provided. assertOptionalIntegerNumber throws this TypeError when passes is defined but not a whole number. The default is 6 and the maximum is 12.

Source

Thrown at packages/effects/src/noise-displacement.ts:198

});

const assertRequiredUvCoordinate = (value: unknown, name: string): void => {
	if (
		!Array.isArray(value) ||
		value.length !== 2 ||
		value.some((item) => typeof item !== 'number' || !Number.isFinite(item))
	) {
		throw new TypeError(`"${name}" must be a [number, number] tuple`);
	}
};

const assertOptionalIntegerNumber = (value: unknown, name: string): void => {
	if (value === undefined) {
		return;
	}

	if (!Number.isInteger(value)) {
		throw new TypeError(
			`"${name}" must be an integer, but got ${JSON.stringify(value)}`,
		);
	}
};

const validatePositive = (value: number, name: string): void => {
	if (value <= 0) {
		throw new TypeError(
			`"${name}" must be greater than 0, but got ${JSON.stringify(value)}`,
		);
	}
};

const validateMax = (value: number, max: number, name: string): void => {
	if (value > max) {
		throw new TypeError(
			`"${name}" must be <= ${max}, but got ${JSON.stringify(value)}`,
		);

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Use a whole number for passes: noiseDisplacement({ passes: 6 }).
2. If computing dynamically, round explicitly: passes: Math.round(computedValue).
3. Omit passes to use the default of 6.
4. Ensure the value is between 1 and 12 (inclusive).

Example fix

// before
noiseDisplacement({ center: [0.5, 0.5], radius: 0.5, passes: 6.5 })

// after
noiseDisplacement({ center: [0.5, 0.5], radius: 0.5, passes: 6 })
// or
noiseDisplacement({ center: [0.5, 0.5], radius: 0.5, passes: Math.round(value) })

// Validate passes before calling noiseDisplacement()
if (params.passes !== undefined && !Number.isInteger(params.passes)) {
  throw new Error(`passes must be an integer, got ${params.passes}`);
}
const result = noiseDisplacement(params);

const isValidPasses = (p: unknown): boolean =>
  p === undefined || (typeof p === 'number' && Number.isInteger(p));

When it happens

Trigger: Calling noiseDisplacement({ passes: 6.5 }), noiseDisplacement({ passes: 3.1 }), or noiseDisplacement({ passes: '6' }) after the finite-number check. Any defined value where Number.isInteger returns false triggers it.

Common situations: Interpolating passes from a slider that allows fractional values; computing passes dynamically with division that yields non-integer results; deserializing passes as a float from config; confusion with other props that accept decimals.

Related errors

• "${name}" must be a [number, number] tuple
• "${name}" must be greater than 0, but got ${JSON.stringify(v
• "${name}" must be <= ${max}, but got ${JSON.stringify(value)
• "strength" must be >= 0, but got ${JSON.stringify(r.strength
• "blur" must be >= 0, but got ${JSON.stringify(r.blur)}

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