remotion-dev/remotion · error · TypeError

width and height must be numbers between 0 and ${MAX_DIMENSI

Error message

width and height must be numbers between 0 and ${MAX_DIMENSION}

What it means

makeCompositionDragData validates the width value before encoding it into drag MIME data. Width must be a finite number greater than 0 and at most MAX_DIMENSION; otherwise this TypeError is thrown. This prevents serializing corrupted or absurd dimensions into drag data consumed by other Studio targets.

Source

Thrown at packages/studio/src/components/composition-drag-data.ts:194

	compositionFile,
	compositionId,
	width,
	height,
	durationInFrames,
}: MakeCompositionDragDataInput): SerializedCompositionDragData & {
	readonly data: CompositionDragData;
} => {
	if ((width === null) !== (height === null)) {
		throw new TypeError(
			'width and height must either both be numbers or both be null',
		);
	}

	if (
		width !== null &&
		(!Number.isFinite(width) || width <= 0 || width > MAX_DIMENSION)
	) {
		throw new TypeError(
			`width and height must be numbers between 0 and ${MAX_DIMENSION}`,
		);
	}

	if (
		height !== null &&
		(!Number.isFinite(height) || height <= 0 || height > MAX_DIMENSION)
	) {
		throw new TypeError(
			`width and height must be numbers between 0 and ${MAX_DIMENSION}`,
		);
	}

	if (
		durationInFrames !== null &&
		(!Number.isInteger(durationInFrames) ||
			durationInFrames <= 0 ||
			durationInFrames > MAX_DURATION_IN_FRAMES)

View on GitHub (pinned to a6a7485a9a)

Solutions

Sanitize width before calling: ensure Number.isFinite(width) && width > 0 && width <= MAX_DIMENSION
Fall back to null/null for both dimensions when width is not a valid finite number
Fix the source of the width value (e.g. composition.width should resolve after metadata loads; gate the call until then)
Log the offending value to identify the upstream calculation bug

Example fix

// before
makeCompositionDragData({..., width: comp.width * scale, height: comp.height * scale})
// after
const w = comp.width * scale;
const h = comp.height * scale;
const ok = Number.isFinite(w) && w > 0 && w <= MAX_DIMENSION && Number.isFinite(h) && h > 0 && h <= MAX_DIMENSION;
makeCompositionDragData({..., width: ok ? w : null, height: ok ? h : null})

Defensive patterns

Strategy: validation

Validate before calling

const validWidth = (w: number | null) =>
  w !== null && Number.isFinite(w) && w > 0 && w <= MAX_DIMENSION ? w : null;

Type guard

const isValidDimension = (n: number | null): n is number =>
  n !== null && Number.isFinite(n) && n > 0 && n <= MAX_DIMENSION;

Try / catch

try {
  return makeCompositionDragData({..., width: rawWidth, height: rawHeight});
} catch (err) {
  if (err instanceof TypeError && err.message.includes('between 0 and')) {
    return makeCompositionDragData({..., width: null, height: null});
  }
  throw err;
}

Prevention

Sanitize dimensions with Number.isFinite before use
Gate drag-data creation until composition metadata is loaded
Clamp values to MAX_DIMENSION instead of trusting raw math
Check for NaN when coercing from strings or undefined

When it happens

Trigger: Calling makeCompositionDragData with width that is not finite (NaN/Infinity), <= 0, or larger than MAX_DIMENSION (while height is valid, so the pair check passed).

Common situations: Composition metadata not yet loaded (width undefined → NaN after coercion); a calculation bug producing 0 or negative sizes; unit confusion (percent vs px); oversized values from unbounded math.

Understand the failure class

Background: Schema validation failed / invalid input schema: payload rejected because its shape doesn't match the expected schema — this error's family across 28 libraries.

Related errors

AI-assisted analysis of remotion-dev/remotion@a6a7485a9a (2026-09-02). Data as JSON: /api/errors/f5c38d5c2965c929. Report an issue: GitHub.