livekit-client 1.7.1 → 1.9.0

package/src/room/events.ts

@@ -168,6 +168,14 @@ export enum RoomEvent {
    */
   ParticipantMetadataChanged = 'participantMetadataChanged',
 
+  /**
+   * Participant's display name changed
+   *
+   * args: (name: string, [[Participant]])
+   *
+   */
+  ParticipantNameChanged = 'participantNameChanged',
+
   /**
    * Room metadata is a simple way for app-specific state to be pushed to
    * all users.
@@ -264,6 +272,12 @@ export enum RoomEvent {
    * args: (isRecording: boolean)
    */
   RecordingStatusChanged = 'recordingStatusChanged',
+
+  /**
+   * Emits whenever the current buffer status of a data channel changes
+   * args: (isLow: boolean, kind: [[DataPacket_Kind]])
+   */
+  DCBufferStatusChanged = 'dcBufferStatusChanged',
 }
 
 export enum ParticipantEvent {
@@ -353,6 +367,14 @@ export enum ParticipantEvent {
    */
   ParticipantMetadataChanged = 'participantMetadataChanged',
 
+  /**
+   * Participant's display name changed
+   *
+   * args: (name: string, [[Participant]])
+   *
+   */
+  ParticipantNameChanged = 'participantNameChanged',
+
   /**
    * Data received from this participant as sender.
    * Data packets provides the ability to use LiveKit to send/receive arbitrary payloads.
@@ -427,10 +449,12 @@ export enum EngineEvent {
   Restarting = 'restarting',
   Restarted = 'restarted',
   SignalResumed = 'signalResumed',
+  SignalRestarted = 'signalRestarted',
   Closing = 'closing',
   MediaTrackAdded = 'mediaTrackAdded',
   ActiveSpeakersUpdate = 'activeSpeakersUpdate',
   DataPacketReceived = 'dataPacketReceived',
+  DCBufferStatusChanged = 'dcBufferStatusChanged',
 }
 
 export enum TrackEvent {

package/src/room/participant/LocalParticipant.ts

@@ -10,35 +10,35 @@ import {
   TrackPublishedResponse,
   TrackUnpublishedResponse,
 } from '../../proto/livekit_rtc';
+import type RTCEngine from '../RTCEngine';
 import { DeviceUnsupportedError, TrackInvalidError, UnexpectedConnectionState } from '../errors';
 import { EngineEvent, ParticipantEvent, TrackEvent } from '../events';
-import type RTCEngine from '../RTCEngine';
 import LocalAudioTrack from '../track/LocalAudioTrack';
 import LocalTrack from '../track/LocalTrack';
 import LocalTrackPublication from '../track/LocalTrackPublication';
 import LocalVideoTrack, { videoLayersFromEncodings } from '../track/LocalVideoTrack';
+import { Track } from '../track/Track';
 import {
   AudioCaptureOptions,
   BackupVideoCodec,
   CreateLocalTracksOptions,
-  isBackupCodec,
   ScreenShareCaptureOptions,
   ScreenSharePresets,
   TrackPublishOptions,
   VideoCaptureOptions,
+  isBackupCodec,
 } from '../track/options';
-import { Track } from '../track/Track';
 import { constraintsForOptions, mergeDefaultOptions } from '../track/utils';
 import type { DataPublishOptions } from '../types';
 import { Future, isFireFox, isSafari, isWeb, supportsAV1 } from '../utils';
 import Participant from './Participant';
 import { ParticipantTrackPermission, trackPermissionToProto } from './ParticipantTrackPermission';
+import RemoteParticipant from './RemoteParticipant';
 import {
   computeTrackBackupEncodings,
   computeVideoEncodings,
   mediaTrackToLocalTrack,
 } from './publishUtils';
-import RemoteParticipant from './RemoteParticipant';
 
 export default class LocalParticipant extends Participant {
   audioTracks: Map<string, LocalTrackPublication>;
@@ -148,6 +148,26 @@ export default class LocalParticipant extends Participant {
     this.reconnectFuture = undefined;
   };
 
+  /**
+   * Sets and updates the metadata of the local participant.
+   * Note: this requires `CanUpdateOwnMetadata` permission encoded in the token.
+   * @param metadata
+   */
+  setMetadata(metadata: string): void {
+    super.setMetadata(metadata);
+    this.engine.client.sendUpdateLocalMetadata(metadata, this.name ?? '');
+  }
+
+  /**
+   * Sets and updates the name of the local participant.
+   * Note: this requires `CanUpdateOwnMetadata` permission encoded in the token.
+   * @param metadata
+   */
+  setName(name: string): void {
+    super.setName(name);
+    this.engine.client.sendUpdateLocalMetadata(this.metadata ?? '', name);
+  }
+
   /**
    * Enable or disable a participant's camera track.
    *
@@ -961,13 +981,15 @@ export default class LocalParticipant extends Participant {
   }
 
   /** @internal */
-  updateInfo(info: ParticipantInfo) {
+  updateInfo(info: ParticipantInfo): boolean {
     if (info.sid !== this.sid) {
       // drop updates that specify a wrong sid.
       // the sid for local participant is only explicitly set on join and full reconnect
-      return;
+      return false;
+    }
+    if (!super.updateInfo(info)) {
+      return false;
     }
-    super.updateInfo(info);
 
     // reconcile track mute status.
     // if server's track mute status doesn't match actual, we'll have to update
@@ -986,6 +1008,7 @@ export default class LocalParticipant extends Participant {
         }
       }
     });
+    return true;
   }
 
   private updateTrackSubscriptionPermissions = () => {

package/src/room/participant/Participant.ts

@@ -2,10 +2,10 @@ import { EventEmitter } from 'events';
 import type TypedEmitter from 'typed-emitter';
 import log from '../../logger';
 import {
-  ConnectionQuality as ProtoQuality,
   DataPacket_Kind,
   ParticipantInfo,
   ParticipantPermission,
+  ConnectionQuality as ProtoQuality,
 } from '../../proto/livekit_models';
 import { ParticipantEvent, TrackEvent } from '../events';
 import type LocalTrackPublication from '../track/LocalTrackPublication';
@@ -144,10 +144,23 @@ export default class Participant extends (EventEmitter as new () => TypedEmitter
   }
 
   /** @internal */
-  updateInfo(info: ParticipantInfo) {
+  updateInfo(info: ParticipantInfo): boolean {
+    // it's possible the update could be applied out of order due to await
+    // during reconnect sequences. when that happens, it's possible for server
+    // to have sent more recent version of participant info while JS is waiting
+    // to process the existing payload.
+    // when the participant sid remains the same, and we already have a later version
+    // of the payload, they can be safely skipped
+    if (
+      this.participantInfo &&
+      this.participantInfo.sid === info.sid &&
+      this.participantInfo.version > info.version
+    ) {
+      return false;
+    }
     this.identity = info.identity;
     this.sid = info.sid;
-    this.name = info.name;
+    this.setName(info.name);
     this.setMetadata(info.metadata);
     if (info.permission) {
       this.setPermissions(info.permission);
@@ -155,6 +168,7 @@ export default class Participant extends (EventEmitter as new () => TypedEmitter
     // set this last so setMetadata can detect changes
     this.participantInfo = info;
     log.trace('update participant info', { info });
+    return true;
   }
 
   /** @internal */
@@ -168,6 +182,15 @@ export default class Participant extends (EventEmitter as new () => TypedEmitter
     }
   }
 
+  protected setName(name: string) {
+    const changed = this.name !== name;
+    this.name = name;
+
+    if (changed) {
+      this.emit(ParticipantEvent.ParticipantNameChanged, name);
+    }
+  }
+
   /** @internal */
   setPermissions(permissions: ParticipantPermission): boolean {
     const prevPermissions = this.permissions;
@@ -250,6 +273,7 @@ export type ParticipantEventCallbacks = {
   localTrackPublished: (publication: LocalTrackPublication) => void;
   localTrackUnpublished: (publication: LocalTrackPublication) => void;
   participantMetadataChanged: (prevMetadata: string | undefined, participant?: any) => void;
+  participantNameChanged: (name: string) => void;
   dataReceived: (payload: Uint8Array, kind: DataPacket_Kind) => void;
   isSpeakingChanged: (speaking: boolean) => void;
   connectionQualityChanged: (connectionQuality: ConnectionQuality) => void;

package/src/room/participant/RemoteParticipant.ts

@@ -3,13 +3,13 @@ import log from '../../logger';
 import type { ParticipantInfo } from '../../proto/livekit_models';
 import type { UpdateSubscription, UpdateTrackSettings } from '../../proto/livekit_rtc';
 import { ParticipantEvent, TrackEvent } from '../events';
-import type { AudioOutputOptions } from '../track/options';
 import RemoteAudioTrack from '../track/RemoteAudioTrack';
 import type RemoteTrack from '../track/RemoteTrack';
 import RemoteTrackPublication from '../track/RemoteTrackPublication';
 import RemoteVideoTrack from '../track/RemoteVideoTrack';
 import { Track } from '../track/Track';
 import type { TrackPublication } from '../track/TrackPublication';
+import type { AudioOutputOptions } from '../track/options';
 import type { AdaptiveStreamSettings } from '../track/types';
 import Participant, { ParticipantEventCallbacks } from './Participant';
 
@@ -215,8 +215,10 @@ export default class RemoteParticipant extends Participant {
   }
 
   /** @internal */
-  updateInfo(info: ParticipantInfo) {
-    super.updateInfo(info);
+  updateInfo(info: ParticipantInfo): boolean {
+    if (!super.updateInfo(info)) {
+      return false;
+    }
 
     // we are getting a list of all available tracks, reconcile in here
     // and send out events for changes
@@ -277,6 +279,7 @@ export default class RemoteParticipant extends Participant {
     newTracks.forEach((publication) => {
       this.emit(ParticipantEvent.TrackPublished, publication);
     });
+    return true;
   }
 
   /** @internal */

package/src/room/participant/publishUtils.test.ts

@@ -3,8 +3,8 @@ import {
   computeDefaultScreenShareSimulcastPresets,
   computeVideoEncodings,
   determineAppropriateEncoding,
-  presets169,
   presets43,
+  presets169,
   presetsForResolution,
   presetsScreenShare,
   sortPresets,

package/src/room/participant/publishUtils.ts

@@ -2,6 +2,7 @@ import log from '../../logger';
 import { TrackInvalidError } from '../errors';
 import LocalAudioTrack from '../track/LocalAudioTrack';
 import LocalVideoTrack from '../track/LocalVideoTrack';
+import { Track } from '../track/Track';
 import {
   BackupVideoCodec,
   ScreenSharePresets,
@@ -12,7 +13,6 @@ import {
   VideoPresets,
   VideoPresets43,
 } from '../track/options';
-import { Track } from '../track/Track';
 
 /** @internal */
 export function mediaTrackToLocalTrack(

package/src/room/track/LocalAudioTrack.ts

@@ -3,8 +3,8 @@ import { TrackEvent } from '../events';
 import { AudioSenderStats, computeBitrate, monitorFrequency } from '../stats';
 import { isWeb } from '../utils';
 import LocalTrack from './LocalTrack';
-import type { AudioCaptureOptions } from './options';
 import { Track } from './Track';
+import type { AudioCaptureOptions } from './options';
 import { constraintsForOptions, detectSilence } from './utils';
 
 export default class LocalAudioTrack extends LocalTrack {
@@ -39,7 +39,8 @@ export default class LocalAudioTrack extends LocalTrack {
   }
 
   async mute(): Promise<LocalAudioTrack> {
-    await this.muteQueue.run(async () => {
+    const unlock = await this.muteLock.lock();
+    try {
       // disabled special handling as it will cause BT headsets to switch communication modes
       if (this.source === Track.Source.Microphone && this.stopOnMute && !this.isUserProvided) {
         log.debug('stopping mic track');
@@ -47,12 +48,15 @@ export default class LocalAudioTrack extends LocalTrack {
         this._mediaStreamTrack.stop();
       }
       await super.mute();
-    });
-    return this;
+      return this;
+    } finally {
+      unlock();
+    }
   }
 
   async unmute(): Promise<LocalAudioTrack> {
-    await this.muteQueue.run(async () => {
+    const unlock = await this.muteLock.lock();
+    try {
       if (
         this.source === Track.Source.Microphone &&
         (this.stopOnMute || this._mediaStreamTrack.readyState === 'ended') &&
@@ -62,8 +66,11 @@ export default class LocalAudioTrack extends LocalTrack {
         await this.restartTrack();
       }
       await super.unmute();
-    });
-    return this;
+
+      return this;
+    } finally {
+      unlock();
+    }
   }
 
   async restartTrack(options?: AudioCaptureOptions) {

package/src/room/track/LocalTrack.ts

@@ -1,11 +1,16 @@
-import Queue from 'async-await-queue';
 import log from '../../logger';
 import DeviceManager from '../DeviceManager';
 import { TrackInvalidError } from '../errors';
 import { TrackEvent } from '../events';
-import { getEmptyAudioStreamTrack, getEmptyVideoStreamTrack, isMobile, sleep } from '../utils';
+import {
+  Mutex,
+  getEmptyAudioStreamTrack,
+  getEmptyVideoStreamTrack,
+  isMobile,
+  sleep,
+} from '../utils';
+import { Track, attachToElement, detachTrack } from './Track';
 import type { VideoCodec } from './options';
-import { attachToElement, detachTrack, Track } from './Track';
 
 const defaultDimensionsTimeout = 2 * 1000;
 
@@ -22,7 +27,9 @@ export default abstract class LocalTrack extends Track {
 
   protected providedByUser: boolean;
 
-  protected muteQueue: Queue;
+  protected muteLock: Mutex;
+
+  protected pauseUpstreamLock: Mutex;
 
   /**
    *
@@ -42,7 +49,8 @@ export default abstract class LocalTrack extends Track {
     this.constraints = constraints ?? mediaTrack.getConstraints();
     this.reacquireTrack = false;
     this.providedByUser = userProvidedTrack;
-    this.muteQueue = new Queue();
+    this.muteLock = new Mutex();
+    this.pauseUpstreamLock = new Mutex();
   }
 
   get id(): string {
@@ -246,7 +254,8 @@ export default abstract class LocalTrack extends Track {
   };
 
   async pauseUpstream() {
-    this.muteQueue.run(async () => {
+    const unlock = await this.pauseUpstreamLock.lock();
+    try {
       if (this._isUpstreamPaused === true) {
         return;
       }
@@ -260,11 +269,14 @@ export default abstract class LocalTrack extends Track {
       const emptyTrack =
         this.kind === Track.Kind.Audio ? getEmptyAudioStreamTrack() : getEmptyVideoStreamTrack();
       await this.sender.replaceTrack(emptyTrack);
-    });
+    } finally {
+      unlock();
+    }
   }
 
   async resumeUpstream() {
-    this.muteQueue.run(async () => {
+    const unlock = await this.pauseUpstreamLock.lock();
+    try {
       if (this._isUpstreamPaused === false) {
         return;
       }
@@ -276,7 +288,9 @@ export default abstract class LocalTrack extends Track {
       this.emit(TrackEvent.UpstreamResumed, this);
 
       await this.sender.replaceTrack(this._mediaStreamTrack);
-    });
+    } finally {
+      unlock();
+    }
   }
 
   protected abstract monitorSender(): void;

package/src/room/track/LocalTrackPublication.ts

@@ -3,9 +3,9 @@ import { TrackEvent } from '../events';
 import type LocalAudioTrack from './LocalAudioTrack';
 import type LocalTrack from './LocalTrack';
 import type LocalVideoTrack from './LocalVideoTrack';
-import type { TrackPublishOptions } from './options';
 import type { Track } from './Track';
 import { TrackPublication } from './TrackPublication';
+import type { TrackPublishOptions } from './options';
 
 export default class LocalTrackPublication extends TrackPublication {
   track?: LocalTrack = undefined;

package/src/room/track/LocalVideoTrack.ts

@@ -2,11 +2,11 @@ import type { SignalClient } from '../../api/SignalClient';
 import log from '../../logger';
 import { VideoLayer, VideoQuality } from '../../proto/livekit_models';
 import type { SubscribedCodec, SubscribedQuality } from '../../proto/livekit_rtc';
-import { computeBitrate, monitorFrequency, VideoSenderStats } from '../stats';
-import { isFireFox, isMobile, isWeb, Mutex } from '../utils';
+import { VideoSenderStats, computeBitrate, monitorFrequency } from '../stats';
+import { Mutex, isFireFox, isMobile, isWeb } from '../utils';
 import LocalTrack from './LocalTrack';
-import type { VideoCaptureOptions, VideoCodec } from './options';
 import { Track } from './Track';
+import type { VideoCaptureOptions, VideoCodec } from './options';
 import { constraintsForOptions } from './utils';
 
 export class SimulcastTrackInfo {
@@ -97,26 +97,32 @@ export default class LocalVideoTrack extends LocalTrack {
   }
 
   async mute(): Promise<LocalVideoTrack> {
-    await this.muteQueue.run(async () => {
+    const unlock = await this.muteLock.lock();
+    try {
       if (this.source === Track.Source.Camera && !this.isUserProvided) {
         log.debug('stopping camera track');
         // also stop the track, so that camera indicator is turned off
         this._mediaStreamTrack.stop();
       }
       await super.mute();
-    });
-    return this;
+      return this;
+    } finally {
+      unlock();
+    }
   }
 
   async unmute(): Promise<LocalVideoTrack> {
-    await this.muteQueue.run(async () => {
+    const unlock = await this.muteLock.lock();
+    try {
       if (this.source === Track.Source.Camera && !this.isUserProvided) {
         log.debug('reacquiring camera track');
         await this.restartTrack();
       }
       await super.unmute();
-    });
-    return this;
+      return this;
+    } finally {
+      unlock();
+    }
   }
 
   async getSenderStats(): Promise<VideoSenderStats[]> {

package/src/room/track/RemoteAudioTrack.ts

@@ -2,9 +2,9 @@ import log from '../../logger';
 import { TrackEvent } from '../events';
 import { AudioReceiverStats, computeBitrate } from '../stats';
 import { supportsSetSinkId } from '../utils';
-import type { AudioOutputOptions } from './options';
 import RemoteTrack from './RemoteTrack';
 import { Track } from './Track';
+import type { AudioOutputOptions } from './options';
 
 export default class RemoteAudioTrack extends RemoteTrack {
   private prevStats?: AudioReceiverStats;

package/src/room/track/RemoteTrackPublication.ts

@@ -4,7 +4,7 @@ import { UpdateSubscription, UpdateTrackSettings } from '../../proto/livekit_rtc
 import { TrackEvent } from '../events';
 import type RemoteTrack from './RemoteTrack';
 import RemoteVideoTrack from './RemoteVideoTrack';
-import type { Track } from './Track';
+import { Track } from './Track';
 import { TrackPublication } from './TrackPublication';
 
 export default class RemoteTrackPublication extends TrackPublication {
@@ -181,6 +181,7 @@ export default class RemoteTrackPublication extends TrackPublication {
       prevTrack.off(TrackEvent.VisibilityChanged, this.handleVisibilityChange);
       prevTrack.off(TrackEvent.Ended, this.handleEnded);
       prevTrack.detach();
+      prevTrack.stopMonitor();
       this.emit(TrackEvent.Unsubscribed, prevTrack);
     }
     super.setTrack(track);
@@ -238,8 +239,8 @@ export default class RemoteTrackPublication extends TrackPublication {
   }
 
   private isManualOperationAllowed(): boolean {
-    if (this.isAdaptiveStream) {
-      log.warn('adaptive stream is enabled, cannot change track settings', {
+    if (this.kind === Track.Kind.Video && this.isAdaptiveStream) {
+      log.warn('adaptive stream is enabled, cannot change video track settings', {
         trackSid: this.trackSid,
       });
       return false;

package/src/room/track/RemoteVideoTrack.test.ts

@@ -1,6 +1,6 @@
+import MockMediaStreamTrack from '../../test/MockMediaStreamTrack';
 import { TrackEvent } from '../events';
 import RemoteVideoTrack, { ElementInfo } from './RemoteVideoTrack';
-import MockMediaStreamTrack from '../../test/MockMediaStreamTrack';
 import type { Track } from './Track';
 
 jest.useFakeTimers();

package/src/room/track/RemoteVideoTrack.ts

@@ -1,16 +1,17 @@
 import { debounce } from 'ts-debounce';
 import log from '../../logger';
 import { TrackEvent } from '../events';
-import { computeBitrate, VideoReceiverStats } from '../stats';
+import { VideoReceiverStats, computeBitrate } from '../stats';
 import CriticalTimers from '../timers';
 import {
+  ObservableMediaElement,
+  getDevicePixelRatio,
   getIntersectionObserver,
   getResizeObserver,
   isWeb,
-  ObservableMediaElement,
 } from '../utils';
 import RemoteTrack from './RemoteTrack';
-import { attachToElement, detachTrack, Track } from './Track';
+import { Track, attachToElement, detachTrack } from './Track';
 import type { AdaptiveStreamSettings } from './types';
 
 const REACTION_DELAY = 100;
@@ -26,7 +27,7 @@ export default class RemoteVideoTrack extends RemoteTrack {
 
   private lastDimensions?: Track.Dimensions;
 
-  private hasUsedAttach: boolean = false;
+  private isObserved: boolean = false;
 
   constructor(
     mediaTrack: MediaStreamTrack,
@@ -43,7 +44,7 @@ export default class RemoteVideoTrack extends RemoteTrack {
   }
 
   get mediaStreamTrack() {
-    if (this.isAdaptiveStream && !this.hasUsedAttach) {
+    if (this.isAdaptiveStream && !this.isObserved) {
       log.warn(
         'When using adaptiveStream, you need to use remoteVideoTrack.attach() to add the track to a HTMLVideoElement, otherwise your video tracks might never start',
       );
@@ -83,7 +84,6 @@ export default class RemoteVideoTrack extends RemoteTrack {
       const elementInfo = new HTMLElementInfo(element);
       this.observeElementInfo(elementInfo);
     }
-    this.hasUsedAttach = true;
     return element;
   }
 
@@ -110,6 +110,7 @@ export default class RemoteVideoTrack extends RemoteTrack {
       // the tab comes into focus for the first time.
       this.debouncedHandleResize();
       this.updateVisibility();
+      this.isObserved = true;
     } else {
       log.warn('visibility resize observer not triggered');
     }
@@ -253,7 +254,7 @@ export default class RemoteVideoTrack extends RemoteTrack {
     let maxHeight = 0;
     for (const info of this.elementInfos) {
       const pixelDensity = this.adaptiveStreamSettings?.pixelDensity ?? 1;
-      const pixelDensityValue = pixelDensity === 'screen' ? window.devicePixelRatio : pixelDensity;
+      const pixelDensityValue = pixelDensity === 'screen' ? getDevicePixelRatio() : pixelDensity;
       const currentElementWidth = info.width() * pixelDensityValue;
       const currentElementHeight = info.height() * pixelDensityValue;
       if (currentElementWidth + currentElementHeight > maxWidth + maxHeight) {