@remotion/renderer: Make renderMedia() and renderStill() return MIME types

packages/docs/docs/renderer/ensure-ffmpeg.mdx

@@ -5,7 +5,7 @@ title: ensureFfmpeg()
 crumb: '@remotion/renderer'
 ---
 
-<AvailableFrom v="3.3" />
+# ensureFfmpeg()<AvailableFrom v="3.3" />
 
 _Removed from v4.0_
 

packages/docs/docs/renderer/ensure-ffprobe.mdx

@@ -5,8 +5,9 @@ title: ensureFfprobe()
 crumb: '@remotion/renderer'
 ---
 
-<AvailableFrom v="3.3" />
+# ensureFfprobe()<AvailableFrom v="3.3" />
 
+_Part of the `@remotion/renderer` package._
 _Removed from v4.0_
 
 :::warning

packages/docs/docs/renderer/extract-audio.mdx

@@ -7,10 +7,6 @@ crumb: '@remotion/renderer'
 
 # extractAudio()<AvailableFrom v="4.0.49" />
 
-:::note
-This function is meant to be used **in Node.js applications**. It cannot run in the browser.
-:::
-
 Extracts the audio from a video source and saves it to the specified output path. It does not convert the audio to a different format.
 
 ## Example

packages/docs/docs/renderer/get-silent-parts.mdx

@@ -9,10 +9,6 @@ crumb: '@remotion/renderer'
 
 # getSilentParts()<AvailableFrom v="4.0.18" />
 
-:::note
-This function is meant to be used **in Node.js applications**. It cannot run in the browser.
-:::
-
 Gets the silent parts of a video or audio in Node.js. Useful for cutting out silence from a video.
 
 ## Example

packages/docs/docs/renderer/make-cancel-signal.mdx

@@ -5,7 +5,9 @@ title: makeCancelSignal()
 crumb: '@remotion/renderer'
 ---
 
-<AvailableFrom v="3.0.15" />
+# makeCancelSignal()<AvailableFrom v="3.0.15" />
+
+_Part of the `@remotion/renderer` package._
 
 This function returns a signal and a cancel function that allows to you cancel a render triggered using [`renderMedia()`](/docs/renderer/render-media), [`renderStill()`](/docs/renderer/render-still), [`renderFrames()`](/docs/renderer/render-frames) or [`stitchFramesToVideo()`](/docs/renderer/stitch-frames-to-video)
 .

packages/docs/docs/renderer/render-media.mdx

@@ -549,6 +549,7 @@ The return value is an object with the following properties:
 
 - `buffer`: If `outputLocation` is not specified or `null`, contains a buffer, otherwise `null`.
 - `slowestFrames`: An array of the 10 slowest frames in the shape of `{frame:<Frame number>, time:<Time to render frame ms>}`. You can use this information to optimise your render times.
+- `mimeType`: <AvailableFrom v="4.0.426" inline /> The MIME type of the rendered output, e.g. `"video/mp4"`, `"video/webm"`, `"image/gif"`.
 
 _**from v3.0.26**:_
 

packages/docs/docs/renderer/render-still.mdx

@@ -245,7 +245,8 @@ Renamed to `jpegQuality` in `v4.0.0`.
 
 The return value is a promise that resolves to an object with the following keys:
 
-- `buffer`: (_available from v3.3.9_) A `Buffer` that only exists if no `output` option was provided. Otherwise null.
+- `buffer`: <AvailableFrom v="3.3.9" inline /> A `Buffer` that only exists if no `output` option was provided. Otherwise null.
+- `mimeType`: <AvailableFrom v="4.0.426" inline /> The MIME type of the rendered output, e.g. `"image/png"`, `"image/jpeg"`.
 
 ## See also
 

packages/it-tests/src/ssr/render-media.test.ts

@@ -124,7 +124,7 @@ test('Render video to a buffer', async () => {
 		throw new Error('not found');
 	}
 
-	const {buffer} = await renderMedia({
+	const {buffer, mimeType} = await renderMedia({
 		codec: 'h264',
 		serveUrl:
 			'https://661808694cad562ef2f35be7--incomparable-dasik-a4482b.netlify.app/',
@@ -134,6 +134,7 @@ test('Render video to a buffer', async () => {
 	});
 
 	expect(buffer?.length).toBeGreaterThan(2000);
+	expect(mimeType).toBe('video/mp4');
 });
 
 test('Should fail invalid serve URL', async () => {

packages/renderer/src/render-media.ts

@@ -40,6 +40,7 @@ import {DEFAULT_JPEG_QUALITY, validateJpegQuality} from './jpeg-quality';
 import {Log} from './logger';
 import type {CancelSignal} from './make-cancel-signal';
 import {cancelErrorMessages, makeCancelSignal} from './make-cancel-signal';
+import {mimeLookup} from './mime-types';
 import type {ChromiumOptions} from './open-browser';
 import {DEFAULT_COLOR_SPACE, type ColorSpace} from './options/color-space';
 import {DEFAULT_RENDER_FRAMES_OFFTHREAD_VIDEO_THREADS} from './options/offthreadvideo-threads';
@@ -220,6 +221,7 @@ type Await<T> = T extends PromiseLike<infer U> ? U : T;
 type RenderMediaResult = {
 	buffer: Buffer | null;
 	slowestFrames: SlowFrame[];
+	mimeType: string;
 };
 
 const internalRenderMediaRaw = ({
@@ -826,6 +828,10 @@ const internalRenderMediaRaw = ({
 				const result: RenderMediaResult = {
 					buffer,
 					slowestFrames,
+					mimeType:
+						mimeLookup(
+							'file.' + getFileExtensionFromCodec(codec, audioCodec),
+						) || 'application/octet-stream',
 				};
 
 				const sendTelemetryAndResolve = () => {

packages/renderer/src/render-still.ts

@@ -31,6 +31,7 @@ import {Log} from './logger';
 import type {CancelSignal} from './make-cancel-signal';
 import {cancelErrorMessages} from './make-cancel-signal';
 import {getAvailableMemory} from './memory/get-available-memory';
+import {mimeLookup} from './mime-types';
 import type {ChromiumOptions} from './open-browser';
 import {internalOpenBrowser} from './open-browser';
 import type {ToOptions} from './options/option';
@@ -118,7 +119,7 @@ export type RenderStillOptions = {
 	};
 
 type CleanupFn = () => Promise<unknown>;
-type RenderStillReturnValue = {buffer: Buffer | null};
+type RenderStillReturnValue = {buffer: Buffer | null; mimeType: string};
 
 const innerRenderStill = async ({
 	composition,
@@ -384,7 +385,10 @@ const innerRenderStill = async ({
 
 	await cleanup();
 
-	return {buffer: output ? null : buffer};
+	return {
+		buffer: output ? null : buffer,
+		mimeType: mimeLookup('file.' + imageFormat) || 'application/octet-stream',
+	};
 };
 
 const internalRenderStillRaw = (

packages/renderer/src/test/render-still.test.ts

@@ -41,7 +41,7 @@ test(
 	async () => {
 		await ensureBrowser();
 
-		const {buffer} = await renderStill({
+		const {buffer, mimeType} = await renderStill({
 			composition: {
 				width: 1000,
 				height: 1000,
@@ -62,6 +62,7 @@ test(
 			verbose: false,
 		});
 		expect(buffer?.length).toBeGreaterThan(1000);
+		expect(mimeType).toBe('image/png');
 	},
 	{
 		timeout: 30000,