The MediaStream.onaddtrack property is an EventHandler which specifies a function to be called when the addtrack event occurs on a MediaStream instance. This happens when a new track of any kind is added to the media stream. This event is fired when the browser adds a track to the stream (such as when a RTCPeerConnection is renegotiated or a stream being captured using HTMLMediaElement.captureStream() gets a new set of tracks because the media element being captured loaded a new source.

The addtrack event does not get fired when JavaScript code explicitly adds tracks to the stream (by calling addTrack()).


MediaStream.onaddtrack = eventHandler;


This should be set to a function which you provide that accepts as input a MediaStreamTrackEvent object representing the addtrack event which has occurred. The MediaStreamTrack representing the track which was added is specified in the event's track property.


This example adds a listener which, when a new track is added to the stream, appends a new item to a list of tracks; the new item shows the track's kind ("audio" or "video") and label.

stream.onaddtrack = function(event) {
  let trackList = document.getElementById("tracks");
  let label = document.createElement("li");

  label.innerHTML = event.track.kind + ": " + event.track.label;


Specification Status Comment
Media Capture and Streams
The definition of 'MediaStream.onaddtrack' in that specification.
Editor's Draft Initial specification.

Browser compatibility

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Yes) 50 (50) ? ? ?
Feature Android Android Webview Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile Chrome for Android
Basic support ? ? 50.0 (50) No support ? ? (Yes)

See also

Document Tags and Contributors

 Contributors to this page: Sheppy
 Last updated by: Sheppy,