{"record":{"id":"1237dc6a0ad729c7","repo":"remotion-dev/remotion","slug":"the-html5video-tag-requires-a-string-for-src","errorCode":null,"errorMessage":"The `<Html5Video>` tag requires a string for `src`, but got ${JSON.stringify(props.src)} instead.","messagePattern":"The `<Html5Video>` tag requires a string for `src`, but got (.+?) instead\\.","errorType":"validation","errorClass":"TypeError","httpStatus":null,"severity":"error","filePath":"packages/core/src/video/html5-video.tsx","lineNumber":64,"sourceCode":"\tconst {loop, ...propsOtherThanLoop} = props;\n\tconst {fps} = useVideoConfig();\n\tconst environment = useRemotionEnvironment();\n\tconst shouldPauseWhenBuffering = resolveV5Default(pauseWhenBuffering);\n\n\tif (environment.isClientSideRendering) {\n\t\tthrow new Error(\n\t\t\t'<Html5Video> is not supported in @remotion/web-renderer. Use <Video> from @remotion/media instead. See https://remotion.dev/docs/client-side-rendering/limitations',\n\t\t);\n\t}\n\n\tconst {durations, setDurations} = useContext(DurationsContext);\n\n\tif (typeof ref === 'string') {\n\t\tthrow new Error('string refs are not supported');\n\t}\n\n\tif (typeof props.src !== 'string') {\n\t\tthrow new TypeError(\n\t\t\t`The \\`<Html5Video>\\` tag requires a string for \\`src\\`, but got ${JSON.stringify(\n\t\t\t\tprops.src,\n\t\t\t)} instead.`,\n\t\t);\n\t}\n\n\tconst preloadedSrc = usePreload(props.src);\n\n\tconst onDuration = useCallback(\n\t\t(src: string, durationInSeconds: number) => {\n\t\t\tsetDurations({type: 'got-duration', durationInSeconds, src});\n\t\t},\n\t\t[setDurations],\n\t);\n\n\tconst durationFetched =\n\t\tdurations[getAbsoluteSrc(preloadedSrc)] ??\n\t\tdurations[getAbsoluteSrc(props.src)];","sourceCodeStart":46,"sourceCodeEnd":82,"githubUrl":"https://github.com/remotion-dev/remotion/blob/78fe4bb3fdb5a2cd68724393d63cb223db333fa7/packages/core/src/video/html5-video.tsx#L46-L82","documentation":"TypeError thrown by Html5Video when `props.src` is not a string. The component requires `src` to be a plain string URL (a staticFile path or absolute URL). The error message echoes the actual value via JSON.stringify so the developer can see exactly what was passed. This guard runs after the CSR and string-ref checks.","triggerScenarios":"Passing a non-string to Html5Video's `src` prop: an object (e.g. an imported module's default), undefined, a number, a React element, or a Blob. Typical when a developer passes `src={importedVideo}` where the import is an object, or forgets the src entirely.","commonSituations":"Importing a video as an ES module and passing the module object instead of its `.src`/`.default`; conditional rendering that leaves src undefined for some frames; passing a Blob/File object from a file input directly as src.","solutions":["Ensure src is a string: use `staticFile('my.mp4')` for assets in public/, or an absolute URL string.","If importing a module, access the string path: `import vid from './vid.mp4'; <Html5Video src={vid} />` only if the bundler resolves it to a string URL; otherwise use staticFile.","Add a runtime check before render: `if (typeof src !== 'string') throw new Error('src must be string');`."],"exampleFix":"// before (module object passed by mistake)\nimport vid from './video.mp4';\n<Html5Video src={vid} />\n\n// after\nimport {staticFile} from 'remotion';\n<Html5Video src={staticFile('video.mp4')} />","handlingStrategy":"type-guard","validationCode":"const srcIsString = typeof props.src === 'string';\nif (!srcIsString) throw new Error('src must be a string URL');","typeGuard":"const isStringSrc = (src: unknown): src is string => typeof src === 'string';","tryCatchPattern":null,"preventionTips":["Always pass `staticFile('name.mp4')` or a literal URL string to src.","Type the prop as `src: string` in your own wrappers.","Avoid passing imported module objects or Blob/File directly."],"tags":["video","typescript","validation","props"],"backgroundTag":null,"analyzedSha":"78fe4bb3fdb5a2cd68724393d63cb223db333fa7","analyzedAt":"2026-08-12T17:18:50.444Z","schemaVersion":2},"datasetVersion":"2026-08-12T18:17:37.767Z"}