remotion-dev/remotion · error · TypeError

The `<OffthreadVideo>` tag requires a string for `src`, but

Error message

The `<OffthreadVideo>` tag requires a string for `src`, but got ${JSON.stringify(props.src)} instead.

What it means

After the client-side-rendering check, `<OffthreadVideo>` enforces that `src` is a string. A non-string `src` (undefined, number, object) would break asset URL resolution and frame extraction downstream. The validator reports the JSON-stringified offending value.

Source

Thrown at packages/core/src/video/OffthreadVideo.tsx:46

		name,
		pauseWhenBuffering,
		_remotionInternalStack,
		showInTimeline,
		...otherProps
	} = props;
	const environment = useRemotionEnvironment();
	const shouldPauseWhenBuffering = resolveV5Default(pauseWhenBuffering);

	if (environment.isClientSideRendering) {
		throw new Error(
			'<OffthreadVideo> is not supported in @remotion/web-renderer. Use <Video> from @remotion/media instead. See https://remotion.dev/docs/client-side-rendering/limitations',
		);
	}

	const onDuration = useCallback(() => undefined, []);

	if (typeof props.src !== 'string') {
		throw new TypeError(
			`The \`<OffthreadVideo>\` tag requires a string for \`src\`, but got ${JSON.stringify(
				props.src,
			)} instead.`,
		);
	}

	validateMediaTrimProps({startFrom, endAt, trimBefore, trimAfter});

	const {trimBeforeValue, trimAfterValue} = resolveTrimProps({
		startFrom,
		endAt,
		trimBefore,
		trimAfter,
	});

	if (
		typeof trimBeforeValue !== 'undefined' ||
		typeof trimAfterValue !== 'undefined'

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Always pass a string URL to `src`, e.g. `src="https://.../video.mp4"` or `src={staticFile('video.mp4')}`.
  2. Use TypeScript: the prop type already requires `string`; tighten your types so the call site fails at compile time.
  3. If loading src from data, narrow it first: `if (typeof src !== 'string') return null;`.

Example fix

// before
<OffthreadVideo src={asset} />
// after
<OffthreadVideo src={asset.url} />
Defensive patterns

Strategy: type-guard

Validate before calling

if (typeof src !== 'string') {
  throw new Error('OffthreadVideo src must be a string');
}

Type guard

const isStringSrc = (v: unknown): v is string => typeof v === 'string' && v.length > 0;

Prevention

When it happens

Trigger: Passing `src={undefined}`, `src={someObject}`, or a dynamic prop that fails to resolve to a string into `<OffthreadVideo>`.

Common situations: Forgetting the `src` prop entirely, or passing a nested field of an asset object (e.g. `src={asset}` instead of `src={asset.url}`).

Related errors


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