twilio-video 2.26.1 → 2.27.0

package/CHANGELOG.md

@@ -2,13 +2,66 @@ The Twilio Programmable Video SDKs use [Semantic Versioning](http://www.semver.o
 
 **Version 1.x reached End of Life on September 8th, 2021.** See the changelog entry [here](https://www.twilio.com/changelog/end-of-life-complete-for-unsupported-versions-of-the-programmable-video-sdk). Support for the 1.x version ended on December 4th, 2020.
 
+2.27.0 (March 21, 2023)
+=======================
+
+Changes
+-------
+
+`VideoTrack.addProcessor` now works on browsers that support `OffscreenCanvas` as well as `HTMLCanvasElement`. When used with
+[@twilio/video-processors v2.0.0](https://github.com/twilio/twilio-video-processors.js/blob/2.0.0/CHANGELOG.md), the Virtual
+Background feature will work on browsers that supports [WebGL2](https://developer.mozilla.org/en-US/docs/Web/API/WebGL2RenderingContext).
+See [VideoTrack.addProcessor](https://sdk.twilio.com/js/video/releases/2.27.0/docs/VideoTrack.html#addProcessor__anchor) and
+[@twilio/video-processors v2.0.0](https://github.com/twilio/twilio-video-processors.js/blob/2.0.0/CHANGELOG.md) for details.
+
+### Example
+
+```ts
+import { createLocalVideoTrack } from 'twilio-video';
+import { Pipeline, VirtualBackgroundProcessor } from '@twilio/video-processors';
+
+const virtualBackgroundProcessor = new VirtualBackgroundProcessor({
+  pipeline: Pipeline.WebGL2,
+  // ...otherOptions
+});
+
+await virtualBackgroundProcessor.loadModel();
+
+const videoTrack = await createLocalVideoTrack({
+  width: 640,
+  height: 480,
+  frameRate: 24
+});
+
+videoTrack.addProcessor(processor, {
+  inputFrameBufferType: 'video',
+  outputFrameBufferContextType: 'webgl2',
+});
+```
+
+2.26.2 (February 21, 2023)
+==========================
+
+Changes
+-------
+
+- Starting from version 110, Chrome will no longer support the iSAC audio codec. The SDK will now log a warning to the console
+  whenever an audio or a video codec that is specified in `ConnectOptions.preferredAudioCodecs` and `ConnectOptions.preferredVideoCodecs`
+  is not supported by the browser. (VIDEO-12494)
+
+Bug Fixes
+---------
+
+- Fixed a bug on Chrome versions 112+ where `Room.getStats()` did not reject the returned Promise when an exception was
+  raised while accessing WebRTC stats that due to a TypeError caused by trying to read from the now-removed `RTCMediaStreamTrackStats`. (VIDEO-12534)
+
 2.26.1 (January 31, 2023)
 =========================
 
 Bug Fixes
 ---------
 
-- Fixed a bug that manifests on Chrome versions 112+ where `Room.getStats()` rejects the returned Promise due to a
+- Fixed a bug that manifests on Chrome versions 112+ where `Room.getStats()` raises an unhandled exception due to a
   TypeError caused by trying to read from the now-removed `RTCMediaStreamTrackStats`. Instead, the SDK now reads from
   the `RTCMediaSourceStats`. (VIDEO-12411) 
 - Fixed an error in the type definition for the `attach()` method of `AudioTrack` and `VideoTrack`. (VIDEO-12242)

package/COMMON_ISSUES.md

@@ -200,10 +200,10 @@ transform: scaleX(-1)
 </p>
 </details>
 <details>
-<summary>iOS 15: Audio is lost in a video call after an interruption with a phone call</summary>
+<summary>iOS 16: Local Media Tracks are lost in a video call after an interruption with a phone call</summary>
 <p>
 
-   Due to a regression on Safari on iOS 15, an incoming call causes local and sometimes remote media playback to stop. You can find more details in this [WebKit bug](https://bugs.webkit.org/show_bug.cgi?id=230537).
+   Due to a bug on Safari on iOS 16, an incoming call causes local and sometimes remote media playback to stop after the **second** incoming call. You can find more details in this [WebKit bug](https://bugs.webkit.org/show_bug.cgi?id=240651). As a workaround, you can call the [Room.refreshInactiveMedia](https://sdk.twilio.com/js/video/releases/2.26.0/docs/Room.html#refreshInactiveMedia__anchor) method in your application in order to restart the muted local media tracks and resume playback of the paused remote media tracks.
 </p>
 </details>
 <details>
@@ -348,7 +348,7 @@ trouble with twilio-video.js, ensure these are not running.
 <summary>setSinkId method is not implemented in all browsers</summary>
 <p>
 
-   The `audioElement.setSinkId()` method, which is used to change the audio output device for a given HTML audio element, is only implemented in Desktop Chrome and Desktop Edge. Therefore, it is not possible for users to change their audio output device in other browsers. Users will have to use their operating system settings to change their audio output device instead. 
+   The `audioElement.setSinkId()` method, which is used to change the audio output device for a given HTML audio element, is only implemented in Desktop Chrome and Desktop Edge. Therefore, it is not possible for users to change their audio output device in other browsers. Users will have to use their operating system settings to change their audio output device instead.
 
    More information about this method (including browser compatibility) is available [here](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/setSinkId).
 </p>

package/README.md

@@ -74,7 +74,7 @@ Releases of twilio-video.js are hosted on a CDN, and you can include these
 directly in your web app using a <script> tag.
 
 ```html
-<script src="//sdk.twilio.com/js/video/releases/2.26.1/twilio-video.min.js"></script>
+<script src="//sdk.twilio.com/js/video/releases/2.27.0/twilio-video.min.js"></script>
 ```
 
 Using this method, twilio-video.js will set a browser global:

package/dist/twilio-video.js

@@ -1,4 +1,4 @@
-/*! twilio-video.js 2.26.1
+/*! twilio-video.js 2.27.0
 
 The following license applies to all parts of this software except as
 documented below.
@@ -86,7 +86,7 @@ module.exports = createCancelableRoomPromise;
 },{"./util/cancelablepromise":124}],2:[function(require,module,exports){
 'use strict';
 var MediaStreamTrack = require('./webrtc').MediaStreamTrack;
-var _a = require('./webrtc/util'), guessBrowser = _a.guessBrowser, guessBrowserVersion = _a.guessBrowserVersion;
+var _a = require('./webrtc/util'), guessBrowser = _a.guessBrowser, guessBrowserVersion = _a.guessBrowserVersion, isCodecSupported = _a.isCodecSupported;
 var createCancelableRoomPromise = require('./cancelableroompromise');
 var EncodingParametersImpl = require('./encodingparameters');
 var LocalParticipant = require('./localparticipant');
@@ -407,6 +407,11 @@ function connect(token, options) {
         video: options.preferredVideoCodecs.map(normalizeCodecSettings)
     };
     var networkQualityConfiguration = new NetworkQualityConfigurationImpl(isNonArrayObject(options.networkQuality) ? options.networkQuality : {});
+    // Log warnings for any unsupported preferred codecs.
+    ['audio', 'video'].forEach(function (kind) { return preferredCodecs[kind].forEach(function (_a) {
+        var codec = _a.codec;
+        return isCodecSupported(codec, kind).then(function (isSupported) { return !isSupported && log.warn("The preferred " + kind + " codec \"" + codec + "\" will be ignored as it is not supported by the browser."); });
+    }); });
     // Create a CancelableRoomPromise<Room> that resolves after these steps:
     // 1 - Get the LocalTracks.
     // 2 - Create the LocalParticipant using options.tracks.
@@ -3868,8 +3873,10 @@ function restartWhenInadvertentlyStopped(localMediaTrack) {
         }).catch(function (error) {
             log.warn('Failed to detect silence:', error);
         }).finally(function () {
-            // Pause the dummy element again.
-            el.pause();
+            // Pause the dummy element again, if there is no processed track.
+            if (!localMediaTrack.processedTrack) {
+                el.pause();
+            }
         });
     }
     function shouldReacquireTrack() {
@@ -4227,8 +4234,8 @@ var LocalVideoTrack = /** @class */ (function (_super) {
     };
     /**
      * Add a {@link VideoProcessor} to allow for custom processing of video frames belonging to a VideoTrack.
-     * Only Chrome supports this as of now. Calling this API from a non-supported browser will result in a log warning.
      * @param {VideoProcessor} processor - The {@link VideoProcessor} to use.
+     * @param {AddProcessorOptions} [options] - {@link AddProcessorOptions} to provide.
      * @returns {this}
      * @example
      * class GrayScaleProcessor {
@@ -4428,9 +4435,10 @@ function workaroundSilentLocalVideo(localVideoTrack, doc) {
         }).catch(function (error) {
             log.warn('Failed to detect silence and restart:', error);
         }).finally(function () {
-            // If silent frames were not detected, then pause the dummy element again.
+            // If silent frames were not detected, then pause the dummy element again,
+            // if there is no processed track.
             el = localVideoTrack._dummyEl;
-            if (el && !el.paused) {
+            if (el && !el.paused && !localVideoTrack.processedTrack) {
                 el.pause();
             }
             // Reset the unmute handler.
@@ -6346,8 +6354,8 @@ var RemoteVideoTrack = /** @class */ (function (_super) {
      * Add a {@link VideoProcessor} to allow for custom processing of video frames belonging to a VideoTrack.
      * When a Participant un-publishes and re-publishes a VideoTrack, a new RemoteVideoTrack is created and
      * any VideoProcessors attached to the previous RemoteVideoTrack would have to be re-added again.
-     * Only Chrome supports this as of now. Calling this API from a non-supported browser will result in a log warning.
      * @param {VideoProcessor} processor - The {@link VideoProcessor} to use.
+     * @param {AddProcessorOptions} [options] - {@link AddProcessorOptions} to provide.
      * @returns {this}
      * @example
      * class GrayScaleProcessor {
@@ -7014,10 +7022,10 @@ var VideoProcessorEventObserver = /** @class */ (function (_super) {
         if (!this._processorInfo) {
             return {};
         }
-        var _a = this._processorInfo, processor = _a.processor, captureHeight = _a.captureHeight, captureWidth = _a.captureWidth, inputFrameRate = _a.inputFrameRate, isRemoteVideoTrack = _a.isRemoteVideoTrack;
-        var data = { captureHeight: captureHeight, captureWidth: captureWidth, inputFrameRate: inputFrameRate, isRemoteVideoTrack: isRemoteVideoTrack };
+        var _a = this._processorInfo, processor = _a.processor, captureHeight = _a.captureHeight, captureWidth = _a.captureWidth, inputFrameRate = _a.inputFrameRate, isRemoteVideoTrack = _a.isRemoteVideoTrack, inputFrameBufferType = _a.inputFrameBufferType, outputFrameBufferContextType = _a.outputFrameBufferContextType;
+        var data = { captureHeight: captureHeight, captureWidth: captureWidth, inputFrameRate: inputFrameRate, isRemoteVideoTrack: isRemoteVideoTrack, inputFrameBufferType: inputFrameBufferType, outputFrameBufferContextType: outputFrameBufferContextType };
         data.name = processor._name || 'VideoProcessor';
-        ['assetsPath', 'blurFilterRadius', 'fitType', 'isSimdEnabled', 'maskBlurRadius', 'version'].forEach(function (prop) {
+        ['assetsPath', 'blurFilterRadius', 'debounce', 'fitType', 'isSimdEnabled', 'maskBlurRadius', 'pipeline', 'version'].forEach(function (prop) {
             var val = processor["_" + prop];
             if (typeof val !== 'undefined') {
                 data[prop] = val;
@@ -7155,6 +7163,10 @@ var VideoTrack = /** @class */ (function (_super) {
                 value: null,
                 writable: true,
             },
+            _processorOptions: {
+                value: {},
+                writable: true,
+            },
             _unmuteHandler: {
                 value: null,
                 writable: true
@@ -7246,18 +7258,21 @@ var VideoTrack = /** @class */ (function (_super) {
                 var _a = _this.mediaStreamTrack.getSettings(), _b = _a.width, width = _b === void 0 ? 0 : _b, _c = _a.height, height = _c === void 0 ? 0 : _c;
                 // Setting the canvas' dimension triggers a redraw.
                 // Only set it if it has changed.
-                if (_this._inputFrame.width !== width) {
-                    _this._inputFrame.width = width;
-                    _this._inputFrame.height = height;
-                    if (_this._outputFrame) {
-                        _this._outputFrame.width = width;
-                        _this._outputFrame.height = height;
+                if (_this._outputFrame && _this._outputFrame.width !== width) {
+                    _this._outputFrame.width = width;
+                    _this._outputFrame.height = height;
+                }
+                if (_this._inputFrame) {
+                    if (_this._inputFrame.width !== width) {
+                        _this._inputFrame.width = width;
+                        _this._inputFrame.height = height;
                     }
+                    _this._inputFrame.getContext('2d').drawImage(_this._dummyEl, 0, 0, width, height);
                 }
-                _this._inputFrame.getContext('2d').drawImage(_this._dummyEl, 0, 0, width, height);
                 var result = null;
                 try {
-                    result = _this.processor.processFrame(_this._inputFrame, _this._outputFrame);
+                    var input = _this._processorOptions.inputFrameBufferType === 'video' ? _this._dummyEl : _this._inputFrame;
+                    result = _this.processor.processFrame(input, _this._outputFrame);
                 }
                 catch (ex) {
                     _this._log.debug('Exception detected after calling processFrame.', ex);
@@ -7265,7 +7280,9 @@ var VideoTrack = /** @class */ (function (_super) {
                 ((result instanceof Promise) ? result : Promise.resolve(result))
                     .then(function () {
                     if (_this._outputFrame) {
-                        _this.processedTrack.requestFrame();
+                        if (typeof _this.processedTrack.requestFrame === 'function') {
+                            _this.processedTrack.requestFrame();
+                        }
                         _this._processorEventObserver.emit('stats');
                     }
                 })
@@ -7308,8 +7325,9 @@ var VideoTrack = /** @class */ (function (_super) {
     VideoTrack.prototype._restartProcessor = function () {
         var processor = this.processor;
         if (processor) {
+            var processorOptions = Object.assign({}, this._processorOptions);
             this.removeProcessor(processor);
-            this.addProcessor(processor);
+            this.addProcessor(processor, processorOptions);
         }
     };
     /**
@@ -7324,8 +7342,8 @@ var VideoTrack = /** @class */ (function (_super) {
     };
     /**
      * Add a {@link VideoProcessor} to allow for custom processing of video frames belonging to a VideoTrack.
-     * Only Chrome supports this as of now. Calling this API from a non-supported browser will result in a log warning.
      * @param {VideoProcessor} processor - The {@link VideoProcessor} to use.
+     * @param {AddProcessorOptions} [options] - {@link AddProcessorOptions} to provide.
      * @returns {this}
      * @example
      * class GrayScaleProcessor {
@@ -7343,11 +7361,8 @@ var VideoTrack = /** @class */ (function (_super) {
      *   videoTrack.addProcessor(new GrayScaleProcessor(100));
      * });
      */
-    VideoTrack.prototype.addProcessor = function (processor) {
+    VideoTrack.prototype.addProcessor = function (processor, options) {
         var _this = this;
-        if (typeof OffscreenCanvas !== 'function') {
-            return this._log.warn('Adding a VideoProcessor is not supported in this browser.');
-        }
         if (!processor || typeof processor.processFrame !== 'function') {
             throw new Error('Received an invalid VideoProcessor from addProcessor.');
         }
@@ -7371,12 +7386,46 @@ var VideoTrack = /** @class */ (function (_super) {
             };
             this.mediaStreamTrack.addEventListener('unmute', this._unmuteHandler);
         }
-        var _a = this.mediaStreamTrack.getSettings(), _b = _a.width, width = _b === void 0 ? 0 : _b, _c = _a.height, height = _c === void 0 ? 0 : _c, _d = _a.frameRate, frameRate = _d === void 0 ? DEFAULT_FRAME_RATE : _d;
-        this._inputFrame = new OffscreenCanvas(width, height);
+        this._processorOptions = options || {};
+        var _a = this._processorOptions, inputFrameBufferType = _a.inputFrameBufferType, outputFrameBufferContextType = _a.outputFrameBufferContextType;
+        if (typeof OffscreenCanvas === 'undefined' && inputFrameBufferType === 'offscreencanvas') {
+            throw new Error('OffscreenCanvas is not supported by this browser.');
+        }
+        if (inputFrameBufferType && inputFrameBufferType !== 'video' && inputFrameBufferType !== 'canvas' && inputFrameBufferType !== 'offscreencanvas') {
+            throw new Error("Invalid inputFrameBufferType of " + inputFrameBufferType);
+        }
+        if (!inputFrameBufferType) {
+            inputFrameBufferType = typeof OffscreenCanvas === 'undefined' ? 'canvas' : 'offscreencanvas';
+        }
+        var _b = this.mediaStreamTrack.getSettings(), _c = _b.width, width = _c === void 0 ? 0 : _c, _d = _b.height, height = _d === void 0 ? 0 : _d, _e = _b.frameRate, frameRate = _e === void 0 ? DEFAULT_FRAME_RATE : _e;
+        if (inputFrameBufferType === 'offscreencanvas') {
+            this._inputFrame = new OffscreenCanvas(width, height);
+        }
+        if (inputFrameBufferType === 'canvas') {
+            this._inputFrame = document.createElement('canvas');
+        }
+        if (this._inputFrame) {
+            this._inputFrame.width = width;
+            this._inputFrame.height = height;
+        }
         this._outputFrame = document.createElement('canvas');
         this._outputFrame.width = width;
         this._outputFrame.height = height;
-        this.processedTrack = this._outputFrame.captureStream(0).getTracks()[0];
+        // NOTE(csantos): Initialize the rendering context for future renders. This also ensures
+        // that the correct type is used and on Firefox, it throws an exception if you try to capture
+        // frames prior calling getContext https://bugzilla.mozilla.org/show_bug.cgi?id=1572422
+        outputFrameBufferContextType = outputFrameBufferContextType || '2d';
+        var ctx = this._outputFrame.getContext(outputFrameBufferContextType);
+        if (!ctx) {
+            throw new Error("Cannot get outputFrameBufferContextType: " + outputFrameBufferContextType + ".");
+        }
+        // NOTE(csantos): Zero FPS means we can control when to render the next frame by calling requestFrame.
+        // Some browsers such as Firefox doesn't support requestFrame so we will use default, which is an undefined value.
+        // This means, the browser will use the highest FPS available.
+        var targetFps = typeof CanvasCaptureMediaStreamTrack !== 'undefined' && CanvasCaptureMediaStreamTrack.prototype &&
+            // eslint-disable-next-line
+            typeof CanvasCaptureMediaStreamTrack.prototype.requestFrame === 'function' ? 0 : undefined;
+        this.processedTrack = this._outputFrame.captureStream(targetFps).getTracks()[0];
         this.processedTrack.enabled = this.mediaStreamTrack.enabled;
         this.processor = processor;
         this._processorEventObserver.emit('add', {
@@ -7384,7 +7433,9 @@ var VideoTrack = /** @class */ (function (_super) {
             captureHeight: height,
             captureWidth: width,
             inputFrameRate: frameRate,
-            isRemoteVideoTrack: this.toString().includes('RemoteVideoTrack')
+            isRemoteVideoTrack: this.toString().includes('RemoteVideoTrack'),
+            inputFrameBufferType: inputFrameBufferType,
+            outputFrameBufferContextType: outputFrameBufferContextType
         });
         this._updateElementsMediaStreamTrack();
         this._captureFrames();
@@ -7521,12 +7572,11 @@ var VideoTrack = /** @class */ (function (_super) {
         this._log.debug('Removing VideoProcessor from the VideoTrack', processor);
         clearTimeout(this._captureTimeoutId);
         this.mediaStreamTrack.removeEventListener('unmute', this._unmuteHandler);
+        this._processorOptions = {};
         this._unmuteHandler = null;
         this._isCapturing = false;
         this.processor = null;
         this.processedTrack = null;
-        this._inputFrame.getContext('2d').clearRect(0, 0, this._inputFrame.width, this._inputFrame.height);
-        this._outputFrame.getContext('2d').clearRect(0, 0, this._outputFrame.width, this._outputFrame.height);
         this._inputFrame = null;
         this._outputFrame = null;
         this._updateElementsMediaStreamTrack();
@@ -7560,7 +7610,7 @@ function dimensionsChanged(track, elem) {
  * Any exception raised (either synchronously or asynchronously) in `processFrame` will result in the frame being dropped.
  * This callback has the following signature:<br/><br/>
  * <code>processFrame(</code><br/>
- * &nbsp;&nbsp;<code>inputFrameBuffer: OffscreenCanvas,</code><br/>
+ * &nbsp;&nbsp;<code>inputFrameBuffer: OffscreenCanvas | HTMLCanvasElement | HTMLVideoElement,</code><br/>
  * &nbsp;&nbsp;<code>outputFrameBuffer: HTMLCanvasElement</code><br/>
  * <code>): Promise&lt;void&gt; | void;</code>
  *
@@ -7576,6 +7626,30 @@ function dimensionsChanged(track, elem) {
  *   }
  * }
  */
+/**
+ * Possible options to provide to {@link LocalVideoTrack#addProcessor} and {@link RemoteVideoTrack#addProcessor}.
+ * @typedef {object} AddProcessorOptions
+ * @property {string} [inputFrameBufferType="offscreencanvas"] - This option allows you to specify what kind of input you want to receive in your
+ * Video Processor. The default is `offscreencanvas` and will fallback to a regular `canvas` if the browser does not support it.
+ * Possible values include the following.
+ * <br/>
+ * <br/>
+ * `offscreencanvas` - Your Video Processor will receive an [OffscreenCanvas](https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas)
+ * which is good for canvas-related processing that can be rendered off screen.
+ * <br/>
+ * <br/>
+ * `canvas` - Your Video Processor will receive an [HTMLCanvasElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement).
+ * This is recommended on browsers that doesn't support `OffscreenCanvas`, or if you need to render the frame on the screen.
+ * <br/>
+ * <br/>
+ * `video` - Your Video Processor will receive an [HTMLVideoElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLVideoElement).
+ * Use this option if you are processing the frame using WebGL or if you only need to [draw](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/drawImage)
+ * the frame directly to your output canvas.
+ * @property {string} [outputFrameBufferContextType="2d"] - The SDK needs the [context type](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/getContext)
+ * that your Video Processor uses in order to properly generate the processed track. For example, if your Video Processor uses WebGL2 (`canvas.getContext('webgl2')`),
+ * you should set `outputFrameBufferContextType` to `webgl2`. Or if you're using Canvas 2D processing (`canvas.getContext('2d')`),
+ * you should set `outputFrameBufferContextType` to `2d`.
+ */
 /**
  * The {@link VideoTrack}'s dimensions changed.
  * @param {VideoTrack} track - The {@link VideoTrack} whose dimensions changed
@@ -26761,14 +26835,14 @@ function getTracks(peerConnection, kind, localOrRemote) {
 function getTrackStats(peerConnection, track, options) {
     if (options === void 0) { options = {}; }
     if (typeof options.testForChrome !== 'undefined' || isChrome) {
-        return chromeOrSafariGetTrackStats(peerConnection, track);
+        return chromeOrSafariGetTrackStats(peerConnection, track, options);
     }
     if (typeof options.testForFirefox !== 'undefined' || isFirefox) {
-        return firefoxGetTrackStats(peerConnection, track, options.isRemote);
+        return firefoxGetTrackStats(peerConnection, track, options);
     }
     if (typeof options.testForSafari !== 'undefined' || isSafari) {
         if (typeof options.testForSafari !== 'undefined' || getSdpFormat() === 'unified') {
-            return chromeOrSafariGetTrackStats(peerConnection, track);
+            return chromeOrSafariGetTrackStats(peerConnection, track, options);
         }
         // NOTE(syerrapragada): getStats() is not supported on
         // Safari versions where plan-b is the SDP format
@@ -26784,33 +26858,31 @@ function getTrackStats(peerConnection, track, options) {
  * Get the standardized statistics for a particular MediaStreamTrack in Chrome or Safari.
  * @param {RTCPeerConnection} peerConnection
  * @param {MediaStreamTrack} track
+ * @param {object} options - Used for testing
  * @returns {Promise.<Array<StandardizedTrackStatsReport>>}
  */
-function chromeOrSafariGetTrackStats(peerConnection, track) {
-    return new Promise(function (resolve, reject) {
-        if (chromeMajorVersion && chromeMajorVersion < 67) {
+function chromeOrSafariGetTrackStats(peerConnection, track, options) {
+    if (chromeMajorVersion && chromeMajorVersion < 67) {
+        return new Promise(function (resolve, reject) {
             peerConnection.getStats(function (response) {
                 resolve([standardizeChromeLegacyStats(response, track)]);
             }, null, reject);
-            return;
-        }
-        peerConnection.getStats(track).then(function (response) {
-            resolve(standardizeChromeOrSafariStats(response));
-        }, reject);
+        });
+    }
+    return peerConnection.getStats(track).then(function (response) {
+        return standardizeChromeOrSafariStats(response, options);
     });
 }
 /**
  * Get the standardized statistics for a particular MediaStreamTrack in Firefox.
  * @param {RTCPeerConnection} peerConnection
  * @param {MediaStreamTrack} track
- * @param {boolean} isRemote
+ * @param {object} options
  * @returns {Promise.<Array<StandardizedTrackStatsReport>>}
  */
-function firefoxGetTrackStats(peerConnection, track, isRemote) {
-    return new Promise(function (resolve, reject) {
-        peerConnection.getStats(track).then(function (response) {
-            resolve([standardizeFirefoxStats(response, isRemote)]);
-        }, reject);
+function firefoxGetTrackStats(peerConnection, track, options) {
+    return peerConnection.getStats(track).then(function (response) {
+        return [standardizeFirefoxStats(response, options)];
     });
 }
 /**
@@ -26885,9 +26957,14 @@ function standardizeChromeLegacyStats(response, track) {
 /**
  * Standardize the MediaStreamTrack's statistics in Chrome or Safari.
  * @param {RTCStatsResponse} response
+ * @param {object} options - Used for testing
  * @returns {Array<StandardizedTrackStatsReport>}
  */
-function standardizeChromeOrSafariStats(response) {
+function standardizeChromeOrSafariStats(response, _a) {
+    var _b = _a.simulateExceptionWhileStandardizingStats, simulateExceptionWhileStandardizingStats = _b === void 0 ? false : _b;
+    if (simulateExceptionWhileStandardizingStats) {
+        throw new Error('Error while gathering stats');
+    }
     var inbound = null;
     // NOTE(mpatwardhan): We should expect more than one "outbound-rtp" stats for a
     // VP8 simulcast MediaStreamTrack.
@@ -27054,17 +27131,21 @@ function standardizeChromeOrSafariStats(response) {
 /**
  * Standardize the MediaStreamTrack's statistics in Firefox.
  * @param {RTCStatsReport} response
- * @param {boolean} isRemote
+ * @param {object} options - Used for testing
  * @returns {StandardizedTrackStatsReport}
  */
-function standardizeFirefoxStats(response, isRemote) {
+function standardizeFirefoxStats(response, _a) {
+    if (response === void 0) { response = new Map(); }
+    var isRemote = _a.isRemote, _b = _a.simulateExceptionWhileStandardizingStats, simulateExceptionWhileStandardizingStats = _b === void 0 ? false : _b;
+    if (simulateExceptionWhileStandardizingStats) {
+        throw new Error('Error while gathering stats');
+    }
     // NOTE(mroberts): If getStats is called on a closed RTCPeerConnection,
     // Firefox returns undefined instead of an RTCStatsReport. We workaround this
     // here. See the following bug for more details:
     //
     //   https://bugzilla.mozilla.org/show_bug.cgi?id=1377225
     //
-    if (response === void 0) { response = new Map(); }
     var inbound = null;
     var outbound = null;
     // NOTE(mmalavalli): Starting from Firefox 63, RTC{Inbound, Outbound}RTPStreamStats.isRemote
@@ -29093,18 +29174,79 @@ function support() {
         && typeof navigator.mediaDevices.getUserMedia === 'function'
         && typeof RTCPeerConnection === 'function';
 }
+/**
+ * Create a Set of supported codecs for a certain kind of media.
+ * @param {'audio'|'video'} kind
+ * @returns {Promise<Set<AudioCodec|VideoCodec>>}
+ */
+function createSupportedCodecsSet(kind) {
+    if (typeof RTCRtpSender !== 'undefined'
+        && typeof RTCRtpSender.getCapabilities === 'function') {
+        return Promise.resolve(new Set(RTCRtpSender
+            .getCapabilities(kind)
+            .codecs
+            .map(function (_a) {
+            var mimeType = _a.mimeType;
+            return mimeType.split('/')[1].toLowerCase();
+        })));
+    }
+    if (typeof RTCPeerConnection === 'undefined'
+        || typeof RTCPeerConnection.prototype === 'undefined'
+        || typeof RTCPeerConnection.prototype.addTransceiver !== 'function'
+        || typeof RTCPeerConnection.prototype.close !== 'function'
+        || typeof RTCPeerConnection.prototype.createOffer !== 'function') {
+        return Promise.resolve(new Set());
+    }
+    var pc = new RTCPeerConnection();
+    pc.addTransceiver(kind);
+    return pc.createOffer().then(function (_a) {
+        var sdp = _a.sdp;
+        pc.close();
+        return new Set((sdp.match(/^a=rtpmap:.+$/gm) || [])
+            .map(function (line) { return line.match(/^a=rtpmap:.+ ([^/]+)/)[1].toLowerCase(); }));
+    }, function () {
+        pc.close();
+        return new Set();
+    });
+}
+// NOTE(mmalavalli): Cache the supported audio and video codecs here.
+var supportedCodecs = new Map();
+/**
+ * Check whether a given codec for a certain kind of media is supported.
+ * @param {AudioCodec|VideoCodec} codec
+ * @param {'audio'|'video'} kind
+ * @returns {Promise<boolean>}
+ */
+function isCodecSupported(codec, kind) {
+    var codecs = supportedCodecs.get(kind);
+    if (codecs) {
+        return Promise.resolve(codecs.has(codec.toLowerCase()));
+    }
+    return createSupportedCodecsSet(kind).then(function (codecs) {
+        supportedCodecs.set(kind, codecs);
+        return codecs.has(codec.toLowerCase());
+    });
+}
+/**
+ * Clear cached supported codecs (unit tests only).
+ */
+function clearCachedSupportedCodecs() {
+    supportedCodecs.clear();
+}
 /**
  * @typedef {object} Deferred
  * @property {Promise} promise
  * @property {function} reject
  * @property {function} resolve
  */
+exports.clearCachedSupportedCodecs = clearCachedSupportedCodecs;
 exports.defer = defer;
 exports.delegateMethods = delegateMethods;
 exports.difference = difference;
 exports.flatMap = flatMap;
 exports.guessBrowser = guessBrowser;
 exports.guessBrowserVersion = guessBrowserVersion;
+exports.isCodecSupported = isCodecSupported;
 exports.isIOSChrome = isIOSChrome;
 exports.interceptEvent = interceptEvent;
 exports.legacyPromise = legacyPromise;
@@ -30010,7 +30152,7 @@ module.exports={
   "name": "twilio-video",
   "title": "Twilio Video",
   "description": "Twilio Video JavaScript Library",
-  "version": "2.26.1",
+  "version": "2.27.0",
   "homepage": "https://twilio.com",
   "author": "Mark Andrus Roberts <mroberts@twilio.com>",
   "contributors": [