Skip to content

Releases: twilio/twilio-video.js

2.18.0

15 Oct 19:02
Compare
Choose a tag to compare

2.18.0 (October 13, 2021)

New Features

Known Issue

In Firefox, although the publishing of a LocalVideoTrack in an Audio Only Group Room fails,
the RoomTrackKindNotSupportedError is not raised. We are actively working on fixing this issue.

2.17.1

21 Sep 22:30
Compare
Choose a tag to compare

2.17.1 (September 21, 2021)

Bug Fixes

  • Fixed a regression in 2.17.0 which caused Chrome screen share tracks to be encoded at lower dimensions. (VIDEO-7000)

2.17.0

15 Sep 00:49
Compare
Choose a tag to compare

2.17.0 (September 14, 2021)

New Features

  • twilio-video.js now supports Chrome on iOS versions 14.3 and above. (VIDEO-5723)

Bug Fixes

  • Fixed a bug where the VideoTracks of Safari Participants with VP8 simulcast enabled sometimes had low frame rates. (VIDEO-6263)
  • Fixed a bug where the screen share track got restarted as a camera track if it was ended when the application was foreground. (VIDEO-3977)

2.16.0

12 Aug 00:40
Compare
Choose a tag to compare

2.16.0 (August 11, 2021)

New Features

This release includes the Preflight API Public Beta (runPreflight) to help test connectivity with Twilio servers. It can be used to detect issues prior to joining a Video Room or as part of a troubleshooting page.

The API connects two peer connections using Twilio's Signaling and TURN servers. It publishes synthetic audio and video tracks from one participant and ensures that other participant receives media on those tracks. After successfully verifying connectivity, it generates a report with information on the connection.

runPreflight was originally introduced as an experimental API in 2.8.0-beta1 and has been updated based on feedback. In short, usage of the API will now be free of charge.

Example:

const { runPreflight } = require('twilio-video');
const token = getAccessToken();

const preflightTest = runPreflight(token);

preflightTest.on('progress', (progress: string) => {
  console.log('preflight progress:', progress);
});

preflightTest.on('failed', (error: Error) => {
  console.error('preflight error:', error);
});

preflightTest.on('completed', (report: PreflightTestReport) => {
  console.log("Test completed in " + report.testTiming.duration + " milliseconds.");
  console.log(" It took " + report.networkTiming.connect?.duration + " milliseconds to connect");
  console.log(" It took " + report.networkTiming.media?.duration + " milliseconds to receive media");
});

The PreflightTestReport generated by preflightTest on completed provides statistics that can be useful in cases where there is a poor connection. Some of the useful statistics in the report are as follows:

  • Packet loss, round trip time, and jitter observed on the connection
  • Network timing measurements on the progress events, such as time to connect or to receive media.
  • Ice candidates and selected ice candidate pairs

preflightTest emits a failed event to indicate test failures. You can use the PreflightProgress events to better understand where the test failed and refer to this guide for interpreting common errors.

A few things to note:

  • This function uses web audio API's. Browser's autoplay policies sometimes require user action before accessing these APIs. Please ensure that this API is called in response to user action like a button click.
  • For testing limitations in available bandwidth, we recommend you use testMediaConnectionBitrate from the RTC Diagnostics SDK.

Bug Fixes

Fixed a bug where the SDK was holding on to internally maintained audio elements longer than needed, now they will be cleaned up once track has started. (VIDEO-6480)

2.15.3 (July 28, 2021)

28 Jul 20:40
Compare
Choose a tag to compare

2.15.3 (July 28, 2021)

Bug Fixes

Fixed a bug where the SDK was not cleaning up internally maintained media elements. This causes memory leaks on certain use cases such as reconnecting or republishing to a room (VIDEO-6336).

Additionally, Chrome 92 started enforcing limit on number of WebMediaPlayers. This blocks creation of WebMediaPlayers once the limit is reached - 75 for desktop and 40 for mobile. This SDK update will help prevent running into this limit issue on use cases such as reconnecting or republishing to a room. Please ensure that your application cleans up media elements as well after they are detached.

const elements = track.detach();
elements.forEach(el => {
  el.remove();
  el.srcObject = null;
});

Please be aware that your application may still run into the Chrome's WebMediaPlayers limit for large rooms where participants exceeds this limit.

July 15, 2021

16 Jul 05:08
Compare
Choose a tag to compare

2.15.2 (July 15, 2021)

Bug Fixes

Fixed a bug where setting clientTrackSwitchOffControl to auto caused the tracks to get switched off aggressively, which resulted in momentary black track during app layout changes (VIDEO-5226).

2.15.1

21 Jun 21:41
Compare
Choose a tag to compare

2.15.1 (June 21, 2021)

New Features

Updated June 24, 2021

  • The Video Processor API has been promoted to GA. There are no changes to the API at this moment and we will continue to improve it on future releases.

Bug Fixes

  • Fixed a bug where twilio-video was throwing an exception in a server-side rendering application.

2.15.0

16 Jun 19:35
Compare
Choose a tag to compare

2.15.0 (June 16, 2021)

Breaking Change on Video Processor API (Beta)

VideoProcessor.processFrame method signature has been changed in order to improve the performance of the Video Processor API. With this update, the output frame buffer is now provided to the processFrame method which should be used to draw the processed frame.

Old signature:

processFrame(inputFrame: OffscreenCanvas)
  : Promise<OffscreenCanvas | null>
  | OffscreenCanvas | null;

New signature:

processFrame(inputFrameBuffer: OffscreenCanvas, outputFrameBuffer: HTMLCanvasElement)
  : Promise<void> | void;

Example:

class GrayScaleProcessor {
  constructor(percentage) {
    this.percentage = percentage;
  }
  processFrame(inputFrameBuffer, outputFrameBuffer) {
    const context = outputFrameBuffer.getContext('2d');
    context.filter = `grayscale(${this.percentage}%)`;
    context.drawImage(inputFrameBuffer, 0, 0, inputFrameBuffer.width, inputFrameBuffer.height);
  }
}

Video.createLocalVideoTrack().then(function(videoTrack) {
  videoTrack.addProcessor(new GrayScaleProcessor(100));
});

Bug Fixes

  • Fixed a bug where isSupported was returning true on certain unsupported mobile browsers. With this release, isSupported should now return true only for the browsers supported by twilio-video.js.

  • Updated NetworkQualityBandwidthStats documentation to reflect the correct bandwidth units, in bits per second, instead of bytes.

2.14.0

11 May 17:24
Compare
Choose a tag to compare

2.14.0 (May 11, 2021)

New Features

This release contains a significant update to the Bandwidth Profile API. It allows for more efficient use of bandwidth and CPU in multi-party applications. In addition it provides developers with more dynamic control over which video tracks are delivered to the client and the preferred video resolution of the tracks. These capabilities are provided via the Client Track Switch Off Control and Content Preferences settings.

Existing Bandwidth Profile settings will continue to function as before, however we recommend developers update their Bandwidth Profile settings to make use of these new capabilities at their earliest convenience.

Client Track Switch Off Control

  • This feature allows subscribers to control whether the media for a RemoteVideoTrack is received or not. Client Track Switch Off Control has two modes of operation:
    • auto (default): The SDK determines whether tracks should be switched off based on document visibility, track attachments, and / or the visibility of video elements.
    • manual: The application requests that individual tracks be switched off or on using the RemoteVideoTrack.switchOff() / switchOn() methods.
  • Note: If your application previously set the maxTracks property to limit the number of tracks visible, you should migrate to using clientTrackSwitchOffControl to take advantage of this feature.

Video Content Preferences

  • This feature allows subscribers to specify preferences about the media that they receive on a RemoteVideoTrack. Video content preferences has two modes of operation:
    • auto (default): The SDK specifies content preferences based on video element size. A RemoteVideoTrack attached to a video element with larger dimensions will get a higher quality video compared to a RemoteVideoTrack attached to a video element with smaller dimensions.
    • manual: The application specifies the content preferences for individual tracks using RemoteVideoTrack.setContentPreferences().
  • Note: If your application previously set the renderDimensions property, you should migrate to using contentPreferencesMode to take advantage of this feature.

Both of these features are available in Group Rooms and are enabled by default if your application specifies Bandwidth Profile Options during connect.

const { connect } = require('twilio-video');
const room = await connect(token, {
  name: 'my-new-room',
  bandwidthProfile: {
    video: {
      /* Defaults to "auto" for both features. Be sure to remove "renderDimensions" and "maxTracks". */
    }
  }
});

Migrating to Attach APIs

The automatic behaviors rely on applications using the attach and detach methods of RemoteVideoTrack. If your application currently uses the underlying MediaStreamTrack to associate Tracks to video elements, you will need to update your application to use the attach/detach methods or use the manual APIs.

Manual Controls

const room = await connect(token, {
  bandwidthProfile: {
    video: {
      contentPreferencesMode: 'manual',
      clientTrackSwitchOffControl: 'manual'
    }
  }
});

When manual controls are used you can operate directly on RemoteVideoTrack to specify preferences. For example, applications can:

  1. Force disabling a track.
remoteTrack.switchOff();
  1. Enable and request QVGA video.
# Only needed if switchOff() was called first.
remoteTrack.switchOn();
remoteTrack.setContentPreferences({
  renderDimensions: { width: 320, height: 240 }
});
  1. Request HD (720p) video.
remoteTrack.setContentPreferences({
  renderDimensions: { width: 1280, height: 720 }
});
  • clientTrackSwitchOffControl Optional property (defaults to "auto"). When omitted or set to "auto" switches off a RemoteVideoTrack when no video element is attached to the track, when all attached video elements of the track are not visible, or when the Document is not visible.

  • contentPreferencesMode Optional property (defaults to "auto"). When omitted or set to "auto" allows the SDK to select video bitrate based on dimension information of the video elements attached to each RemoteVideoTrack.

  • renderDimensions is deprecated and will raise a warning when set. Setting both renderDimensions and contentPreferencesMode is not allowed and will raise an exception.

  • maxTracks is deprecated and will raise a warning when set. Setting both maxTracks and clientTrackSwitchOffControl is not allowed and will raise an exception.

Bug Fixes

  • Fixed a bug where loading twilio-video.js resulted in page errors on Firefox Galaxy S9 simulation mode. (VIDEO-4654)
  • Fixed LocalDataTrackOptions TypeScript Definition to match documentation and extend properties from LocalTrackOptions. (VIDEO-5116)

2.13.1

17 Mar 18:56
Compare
Choose a tag to compare

2.13.1 (March 17, 2021)

New Features

  • The Video Processor API has been promoted to beta. There are no changes to the API at this moment and we will continue to improve it on future releases.

Bug Fixes

  • Fixed a bug where Android Firefox Participants sometime failed to publish VP8 VideoTracks in a Group Room. (VIDEO-3736)