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.
Candidate Recommendation Initial specification.

Browser compatibility

ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
onaddtrackChrome Full support 26Edge Full support 12Firefox Full support 50IE No support NoOpera No support NoSafari Full support YesWebView Android Full support 37Chrome Android Full support 26Firefox Android Full support 50Opera Android No support NoSafari iOS Full support YesSamsung Internet Android Full support 1.5


Full support
Full support
No support
No support

See also