/DOM Events


addtrack events are produced by the following APIs:

Sent to a track list object which is part of a media element in order to let the element know that tracks have been added to that list. The target of these events is one of HTMLMediaElement.audioTracks, videoTracks, or textTracks, depending on the type of media contained in the track being added to the HTMLMediaElement.
Media Capture and Streams
Sent to a MediaStream when a new MediaStreamTrack is added to it.

General info

HTML Living Standard
The definition of 'addtrack' in that specification.
Media Capture and Streams
The definition of 'addtrack' in that specification.
TrackEvent (HTML DOM)
MediaStreamTrackEvent (Media Capture and Streams)
AudioTrackList (HTML DOM)
MediaStream (Media Capture and Streams)
Default Action


This event implements the properties of TrackEvent (HTML DOM) or MediaStreamTrackEvent (Media Capture and Streams).


This event implements the methods of TrackEvent (HTML DOM) or MediaStreamTrackEvent (Media Capture and Streams).

Usage notes

HTML DOM (Media elements)

To detect when tracks are added to an HTML media element (<audio> or <video>), you can watch for addtrack events to be delivered to the appropriate track list within the media element.

Each media element has three track list properties, one for each type of track which may be a component of a media stream:

An AudioTrackList containing all of the media element's audio tracks. You can add a listener for addtrack to this object to be alerted when new audio tracks are added to the element.
Add an addtrack listener to this VideoTrackList object to be informed when video tracks are added to the element.
Add an addtrack event listener to this TextTrackList to be notified when new text tracks are added to the element.

You can add the event listener by either setting the appropriate object's onaddtrack event handler (such as AudioTrackList.onaddtrack), or by using the addEventListener() method on the appropriate track list.

Media Capture and Streams

An addtrack event is fired when the browser adds a track to a MediaStream (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.

An event handler for this event can be added by setting the MediaStream.onaddtrack property, or by calling addEventListener() on the MediaStream which you want to monitor for track additions.


Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

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

See also

© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.