remotion-dev/remotion · error · TypeError

No `src` was passed to <NewAudioForPreview>.

Error message

No `src` was passed to <NewAudioForPreview>.

What it means

Thrown by <NewAudioForPreview> in @remotion/media when the `src` prop is falsy during Studio preview. The internal preview component needs a concrete URL to preload and play audio, so an empty/undefined source is a hard error rather than silent silence.

Source

Thrown at packages/media/src/audio/audio-for-preview.tsx:113

	const volumePropFrame = useFrameForVolumeProp(
		loopVolumeCurveBehavior ?? 'repeat',
	);

	const userPreferredVolume = evaluateVolume({
		frame: volumePropFrame,
		volume,
		mediaVolume,
	});

	warnAboutTooHighVolume(userPreferredVolume);

	if (!videoConfig) {
		throw new Error('No video config found');
	}

	if (!src) {
		throw new TypeError('No `src` was passed to <NewAudioForPreview>.');
	}

	const currentTime = frame / videoConfig.fps;

	const currentTimeRef = useRef(currentTime);
	currentTimeRef.current = currentTime;

	const preloadedSrc = usePreload(src);

	const parentSequence = useContext(SequenceContext);
	const isPremounting = Boolean(parentSequence?.premounting);
	const isPostmounting = Boolean(parentSequence?.postmounting);
	const sequenceOffset = (parentSequence?.absoluteFrom ?? 0) / videoConfig.fps;

	const bufferingContext = useContext(Internals.BufferingContextReact);

	if (!bufferingContext) {
		throw new Error(

View on GitHub (pinned to 78fe4bb3fd)

Solutions

  1. Provide a non-empty string src: <Audio src={staticFile('audio.mp3')} />.
  2. If audio is optional, conditionally render the component: {src && <Audio src={src} />}.
  3. Verify the src variable is populated before the composition renders (check the prop value in Studio).

Example fix

// before
<Audio src={audioUrl} /> // audioUrl may be undefined during preview

// after
{audioUrl ? <Audio src={audioUrl} /> : null}
Defensive patterns

Strategy: validation

Validate before calling

const audioSrc = typeof src === 'string' && src.length > 0 ? src : null;
return audioSrc ? <Audio src={audioSrc} /> : null;

Type guard

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

Prevention

When it happens

Trigger: Rendering <Audio src={undefined} />, <Audio src={''} />, or <Audio src={null} /> inside a composition that runs in Remotion Studio preview. Typically the src is bound to a variable that is not yet populated (e.g. a staticFile path computed conditionally).

Common situations: Loading audio src from props that are optional and not yet set, building src from a template that yields empty string, or forgetting to call staticFile() on an asset that lives in public/.

Related errors


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