VideoTrackList: addtrack event

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

See full compatibility

The addtrack event is fired when a video track is added to a VideoTrackList.

Syntax

Use the event name in methods like addEventListener(), or set an event handler property.

addEventListener("addtrack", (event) => { })

onaddtrack = (event) => { }

Event type

A TrackEvent. Inherits from Event.

Event properties

In addition to the properties listed below, properties from the parent interface, Event, are available.

track Read only: The newly-added VideoTrack the event is in reference to.

Examples

Using addEventListener():

const videoElement = document.querySelector("video");

videoElement.videoTracks.addEventListener("addtrack", (event) => {
  console.log(`Video track: ${event.track.label} added`);
});

Using the onaddtrack event handler property:

const videoElement = document.querySelector("video");

videoElement.videoTracks.onaddtrack = (event) => {
  console.log(`Video track: ${event.track.label} added`);
};

Specifications

Specification
HTML # event-media-addtrack
HTML # handler-tracklist-onaddtrack

Browser compatibility

	desktop					mobile
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox for Android	Opera Android	Safari on iOS	Samsung Internet	WebView Android	WebView on iOS
`addtrack` event	Chrome – No support Chrome 37 (Release date: 2014-08-26) disabled disabled From version 37 users must explicitly set the `enable-experimental-web-platform-features` preference to `enabled`. To change preferences in Chrome, visit chrome://flags.	Edge – No support Edge 12 – 18 (Release date: 2015-07-29) unknown Support unknown Edge – No support Edge 79 (Release date: 2020-01-15) disabled disabled From version 79 users must explicitly set the `enable-experimental-web-platform-features` preference to `enabled`. To change preferences in Edge, visit about:flags.	Firefox – No support Firefox 33 (Release date: 2014-10-14) disabled disabled From version 33 users must explicitly set the `media.track.enabled` preference to `true`. To change preferences in Firefox, visit about:config.	Opera – No support Opera 24 (Release date: 2014-09-02) disabled disabled From version 24 users must explicitly set the `enable-experimental-web-platform-features` preference to `enabled`. To change preferences in Opera, visit opera://flags.	Safari – Full support Safari 7 (Release date: 2013-10-22) footnote Full support	Chrome Android – No support Chrome Android 37 (Release date: 2014-09-03) disabled disabled From version 37 users must explicitly set the `enable-experimental-web-platform-features` preference to `enabled`. To change preferences in Chrome Android, visit chrome://flags.	Firefox for Android – No support Firefox for Android footnote No support	Opera Android – No support Opera Android footnote No support	Safari on iOS – Full support Safari on iOS 7 (Release date: 2013-09-18) footnote Full support	Samsung Internet – No support Samsung Internet footnote No support	WebView Android – No support WebView Android footnote No support	WebView on iOS – Full support WebView on iOS 7 (Release date: 2013-09-18) footnote Full support

Tip: you can click/tap on a cell for more information.

Full support: Full support
No support: No support
: User must explicitly enable this feature.
: Has more compatibility info.