JavaScript MediaStream getVideoTracks() Method

Beginner
5 min read
Updated: Nov 2026
5 examples
Method
Decorative image with the word GETVIDEOTRACKS

Definition

MediaStream.getVideoTracks() returns an array of every MediaStreamTrack in the stream whose kind is "video". Per MDN, the array is empty when there are no video tracks.

Pass the required arguments shown below. Check return values and browser support before you rely on the result.

Syntax

Call stream.getVideoTracks. Start with this line.

JavaScript
mediaStream.getVideoTracks()
CallWhat it does
mediaStream.getVideoTracks()Primary signature.
stream.getVideoTracks(...)Call with the arguments your case needs.

Built into the browser. Call getVideoTracks(...) on a MediaStream — no import required.

Library declarations
JavaScript
mediaStream.getVideoTracks()

Parameters

This member has no parameters beyond those shown in the signature.

Return Value

Return ValueDescription
*Array of video MediaStreamTracks (may be empty)

JavaScript Examples

Example 1 — Basic getVideoTracks()

List video tracks from a canvas capture stream (no camera permission).

JavaScript
const stream = document.createElement("canvas").captureStream();
const video = stream.getVideoTracks();

console.log(video.length); // 1
console.log(video[0].kind); // "video"
Try It Yourself

How It Works

  1. Capture a canvas stream. One video track, no permissions.
  2. Call getVideoTracks(). Returns an array of video tracks.
  3. Check length. Here it is 1.
  4. Check kind. Always "video" for these entries.

Example 2 — Audio-Only Returns []

Web Audio destination has audio only — video list is empty.

JavaScript
const ctx = new AudioContext();
const stream = ctx.createMediaStreamDestination().stream;
const video = stream.getVideoTracks();
const audio = stream.getAudioTracks();

console.log(video.length); // 0
console.log(audio.length); // 1

ctx.close();
Try It Yourself

How It Works

  1. Create an audio-only stream. Web Audio destination — no video.
  2. Ask for video tracks. Filter finds none.
  3. Length is 0. Safe empty array — not an error.
  4. Audio still present. Use getAudioTracks() for that side.

Example 3 — Audio + Video Stream

Compose both kinds, then split with the getters.

JavaScript
const ctx = new AudioContext();
const audioTrack = ctx.createMediaStreamDestination()
  .stream.getAudioTracks()[0];
const videoTrack = document.createElement("canvas")
  .captureStream().getVideoTracks()[0];

const stream = new MediaStream([audioTrack, videoTrack]);

console.log(stream.getVideoTracks().length); // 1
console.log(stream.getAudioTracks().length); // 1
console.log(stream.getTracks().length);      // 2

ctx.close();
Try It Yourself

How It Works

  1. Take one audio track. From a Web Audio destination.
  2. Take one video track. From canvas capture.
  3. Build one stream. new MediaStream([audio, video]).
  4. Split by kind. Video and audio getters each report 1; total is 2.

Example 4 — vs getTracks() Filter

Same count as filtering kind === "video" yourself.

JavaScript
const stream = document.createElement("canvas").captureStream();

const direct = stream.getVideoTracks();
const filtered = stream.getTracks().filter(
  (t) => t.kind === "video"
);

console.log(direct.length);   // 1
console.log(filtered.length); // 1
console.log(direct[0] === filtered[0]); // true
Try It Yourself

How It Works

  1. Get video the short way. getVideoTracks().
  2. Get video the long way. Filter getTracks() by kind.
  3. Lengths match. Same selection rule.
  4. Same objects. Prefer the dedicated helper for clarity.

Example 5 — Mute Video Tracks

Set enabled = false on every video track (soft mute / black frames).

JavaScript
const stream = document.createElement("canvas").captureStream();

stream.getVideoTracks().forEach((track) => {
  track.enabled = false;
});

console.log(stream.getVideoTracks()[0].enabled); // false
Try It Yourself

How It Works

  1. List video tracks. Loop with forEach.
  2. Set enabled = false. Soft mute — track stays in the stream.
  3. Read back. enabled is now false.
  4. vs stop(). Stopping ends the track; muting can be reversed with enabled = true.
Compatibility

Browser Support

MediaStream.getVideoTracks() is Baseline Widely available (MDN: since September 2017). It is part of the Media Capture and Streams specification. It is a browser Web API — not available in Node.js, Bun, or Deno.

✓ Baseline · Widely available

MediaStream.getVideoTracks()

Supported across modern Chrome, Firefox, Safari, and Edge for listing video tracks.

98% Browser support
Google Chrome Supported · Desktop & Mobile
Full support
Mozilla Firefox Supported · Desktop & Mobile
Full support
Apple Safari Supported · macOS & iOS
Full support
Microsoft Edge Supported · Chromium
Full support
Internet Explorer No native support · Use a polyfill
Polyfill
Opera Supported · Modern versions
Full support
Samsung Internet Supported · Android
Full support
Android WebView Supported · Modern WebView
Full support
getVideoTracks() Excellent

Bottom line: Browser only — not a Node.js API. Safe for production. Use it whenever you need only the video tracks from a MediaStream.

Frequently Asked Questions

An array of MediaStreamTrack objects whose kind is "video". If the stream has no video tracks, the array is empty.
No. MDN marks MediaStream.getVideoTracks() as Baseline Widely available (since September 2017). It is not Deprecated, Experimental, or Non-standard.
No. Call it on a MediaStream with no arguments: stream.getVideoTracks().
No. MDN says the order is not defined by the specification and may change from one call to the next.
getTracks() returns every track. getVideoTracks() returns only tracks where track.kind === "video".
getVideoTracks() returns []. That is normal — check length before using tracks[0].

Next: removeTrack()

Remove a MediaStreamTrack from the stream’s track set.

removeTrack() →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

10 people found this page helpful

JavaScript MediaStream getTracks() Method JavaScript MediaStream removeTrack() Method