@stream-io/video-client 0.2.3 → 0.3.1

package/src/devices/InputMediaDeviceManagerState.ts

@@ -0,0 +1,111 @@
+import { BehaviorSubject, Observable, distinctUntilChanged } from 'rxjs';
+import { RxUtils } from '../store';
+
+export type InputDeviceStatus = 'enabled' | 'disabled' | undefined;
+
+export abstract class InputMediaDeviceManagerState {
+  protected statusSubject = new BehaviorSubject<InputDeviceStatus>(undefined);
+  protected mediaStreamSubject = new BehaviorSubject<MediaStream | undefined>(
+    undefined,
+  );
+  protected selectedDeviceSubject = new BehaviorSubject<string | undefined>(
+    undefined,
+  );
+
+  /**
+   * An Observable that emits the current media stream, or `undefined` if the device is currently disabled.
+   *
+   */
+  mediaStream$: Observable<MediaStream | undefined>;
+
+  /**
+   * An Observable that emits the currently selected device
+   */
+  selectedDevice$: Observable<string | undefined>;
+
+  /**
+   * An Observable that emits the device status
+   */
+  status$: Observable<InputDeviceStatus>;
+
+  constructor() {
+    this.mediaStream$ = this.mediaStreamSubject.asObservable();
+    this.selectedDevice$ = this.selectedDeviceSubject
+      .asObservable()
+      .pipe(distinctUntilChanged());
+    this.status$ = this.statusSubject.asObservable();
+  }
+
+  /**
+   * The device status
+   */
+  get status() {
+    return this.getCurrentValue(this.status$);
+  }
+
+  /**
+   * The currently selected device
+   */
+  get selectedDevice() {
+    return this.getCurrentValue(this.selectedDevice$);
+  }
+
+  /**
+   * The current media stream, or `undefined` if the device is currently disabled.
+   */
+  get mediaStream() {
+    return this.getCurrentValue(this.mediaStream$);
+  }
+
+  /**
+   * Gets the current value of an observable, or undefined if the observable has
+   * not emitted a value yet.
+   *
+   * @param observable$ the observable to get the value from.
+   */
+  getCurrentValue = RxUtils.getCurrentValue;
+
+  /**
+   * @internal
+   * @param status
+   */
+  setStatus(status: InputDeviceStatus) {
+    this.setCurrentValue(this.statusSubject, status);
+  }
+
+  /**
+   * @internal
+   * @param stream
+   */
+  setMediaStream(stream: MediaStream | undefined) {
+    this.setCurrentValue(this.mediaStreamSubject, stream);
+    if (stream) {
+      this.setDevice(this.getDeviceIdFromStream(stream));
+    }
+  }
+
+  /**
+   * @internal
+   * @param stream
+   */
+  setDevice(deviceId: string | undefined) {
+    this.setCurrentValue(this.selectedDeviceSubject, deviceId);
+  }
+
+  /**
+   * Updates the value of the provided Subject.
+   * An `update` can either be a new value or a function which takes
+   * the current value and returns a new value.
+   *
+   * @internal
+   *
+   * @param subject the subject to update.
+   * @param update the update to apply to the subject.
+   * @return the updated value.
+   */
+  protected setCurrentValue = RxUtils.setCurrentValue;
+
+  protected abstract getDeviceIdFromStream(
+    stream: MediaStream,
+  ): string | undefined;
+}

package/src/devices/MicrophoneManager.ts

@@ -0,0 +1,45 @@
+import { Observable } from 'rxjs';
+import { Call } from '../Call';
+import { InputMediaDeviceManager } from './InputMediaDeviceManager';
+import { MicrophoneManagerState } from './MicrophoneManagerState';
+import { getAudioDevices, getAudioStream } from './devices';
+import { TrackType } from '../gen/video/sfu/models/models';
+
+export class MicrophoneManager extends InputMediaDeviceManager<MicrophoneManagerState> {
+  constructor(call: Call) {
+    super(call, new MicrophoneManagerState());
+  }
+
+  protected getDevices(): Observable<MediaDeviceInfo[]> {
+    return getAudioDevices();
+  }
+  protected getStream(
+    constraints: MediaTrackConstraints,
+  ): Promise<MediaStream> {
+    return getAudioStream(constraints);
+  }
+  protected publishStream(stream: MediaStream): Promise<void> {
+    return this.call.publishAudioStream(stream);
+  }
+  protected stopPublishStream(): Promise<void> {
+    return this.call.stopPublish(TrackType.AUDIO);
+  }
+
+  /**
+   * Disables the audio tracks of the microphone
+   */
+  pause() {
+    this.state.mediaStream?.getAudioTracks().forEach((track) => {
+      track.enabled = false;
+    });
+  }
+
+  /**
+   * (Re)enables the audio tracks of the microphone
+   */
+  resume() {
+    this.state.mediaStream?.getAudioTracks().forEach((track) => {
+      track.enabled = true;
+    });
+  }
+}

package/src/devices/MicrophoneManagerState.ts

@@ -0,0 +1,9 @@
+import { InputMediaDeviceManagerState } from './InputMediaDeviceManagerState';
+
+export class MicrophoneManagerState extends InputMediaDeviceManagerState {
+  protected getDeviceIdFromStream(stream: MediaStream): string | undefined {
+    return stream.getAudioTracks()[0]?.getSettings().deviceId as
+      | string
+      | undefined;
+  }
+}

package/src/devices/__tests__/CameraManager.test.ts

@@ -0,0 +1,150 @@
+import { Call } from '../../Call';
+import { StreamClient } from '../../coordinator/connection/client';
+import { CallingState, StreamVideoWriteableStateStore } from '../../store';
+
+import { afterEach, beforeEach, describe, vi, it, expect, Mock } from 'vitest';
+import { mockCall, mockVideoDevices, mockVideoStream } from './mocks';
+import { getVideoStream } from '../devices';
+import { TrackType } from '../../gen/video/sfu/models/models';
+import { CameraManager } from '../CameraManager';
+import { of } from 'rxjs';
+import { CallSettingsResponse } from '../../gen/coordinator';
+
+vi.mock('../devices.ts', () => {
+  console.log('MOCKING devices API');
+  return {
+    disposeOfMediaStream: vi.fn(),
+    getVideoDevices: vi.fn(() => {
+      return of(mockVideoDevices);
+    }),
+    getVideoStream: vi.fn(() => Promise.resolve(mockVideoStream())),
+  };
+});
+
+vi.mock('../../Call.ts', () => {
+  console.log('MOCKING Call');
+  return {
+    Call: vi.fn(() => mockCall()),
+  };
+});
+
+describe('CameraManager', () => {
+  let manager: CameraManager;
+
+  beforeEach(() => {
+    manager = new CameraManager(
+      new Call({
+        id: '',
+        type: '',
+        streamClient: new StreamClient('abc123'),
+        clientStore: new StreamVideoWriteableStateStore(),
+      }),
+    );
+  });
+
+  it('list devices', () => {
+    const spy = vi.fn();
+    manager.listDevices().subscribe(spy);
+
+    expect(spy).toHaveBeenCalledWith(mockVideoDevices);
+  });
+
+  it('get stream', async () => {
+    await manager.enable();
+
+    expect(getVideoStream).toHaveBeenCalledWith({
+      deviceId: undefined,
+    });
+  });
+
+  it('should get device id from stream', async () => {
+    expect(manager.state.selectedDevice).toBeUndefined();
+
+    await manager.enable();
+
+    expect(manager.state.selectedDevice).toBeDefined();
+  });
+
+  it('publish stream', async () => {
+    // @ts-expect-error
+    manager['call'].state.callingState = CallingState.JOINED;
+
+    await manager.enable();
+
+    expect(manager['call'].publishVideoStream).toHaveBeenCalledWith(
+      manager.state.mediaStream,
+    );
+  });
+
+  it('stop publish stream', async () => {
+    // @ts-expect-error
+    manager['call'].state.callingState = CallingState.JOINED;
+    await manager.enable();
+
+    await manager.disable();
+
+    expect(manager['call'].stopPublish).toHaveBeenCalledWith(TrackType.VIDEO);
+  });
+
+  it('flip', async () => {
+    await manager.selectDirection('front');
+
+    await manager.flip();
+
+    expect(manager.state.direction).toBe('back');
+  });
+
+  it('select camera direction', async () => {
+    expect(manager.state.direction).toBe(undefined);
+
+    await manager.enable();
+
+    expect(getVideoStream).toHaveBeenCalledWith({ deviceId: undefined });
+
+    await manager.selectDirection('front');
+
+    expect(getVideoStream).toHaveBeenCalledWith({
+      deviceId: undefined,
+      facingMode: 'user',
+    });
+
+    await manager.selectDirection('back');
+
+    expect(getVideoStream).toHaveBeenCalledWith({
+      deviceId: undefined,
+      facingMode: 'environment',
+    });
+  });
+
+  it(`shouldn't set deviceId and facingMode at the same time`, async () => {
+    await manager.enable();
+
+    await manager.flip();
+
+    expect(getVideoStream).toHaveBeenCalledWith({ facingMode: 'environment' });
+
+    const deviceId = mockVideoDevices[1].deviceId;
+    await manager.select(deviceId);
+
+    expect((getVideoStream as Mock).mock.lastCall[0]).toEqual({
+      deviceId,
+    });
+  });
+
+  it('should pause and resume tracks', async () => {
+    await manager.enable();
+
+    manager.pause();
+
+    expect(manager.state.mediaStream?.getVideoTracks()[0].enabled).toBe(false);
+
+    manager.resume();
+
+    expect(manager.state.mediaStream?.getVideoTracks()[0].enabled).toBe(true);
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+    vi.resetModules();
+  });
+});

package/src/devices/__tests__/InputMediaDeviceManager.test.ts

@@ -0,0 +1,159 @@
+import { Call } from '../../Call';
+import { StreamClient } from '../../coordinator/connection/client';
+import { CallingState, StreamVideoWriteableStateStore } from '../../store';
+
+import { afterEach, beforeEach, describe, vi, it, expect } from 'vitest';
+import { mockCall, mockVideoDevices, mockVideoStream } from './mocks';
+import { InputMediaDeviceManager } from '../InputMediaDeviceManager';
+import { InputMediaDeviceManagerState } from '../InputMediaDeviceManagerState';
+import { of } from 'rxjs';
+
+vi.mock('../../Call.ts', () => {
+  console.log('MOCKING Call');
+  return {
+    Call: vi.fn(() => mockCall()),
+  };
+});
+
+class TestInputMediaDeviceManagerState extends InputMediaDeviceManagerState {
+  public getDeviceIdFromStream = vi.fn(() => 'mock-device-id');
+}
+
+class TestInputMediaDeviceManager extends InputMediaDeviceManager<TestInputMediaDeviceManagerState> {
+  public getDevices = vi.fn(() => of(mockVideoDevices));
+  public getStream = vi.fn(() => Promise.resolve(mockVideoStream()));
+  public publishStream = vi.fn();
+  public stopPublishStream = vi.fn();
+  public pause = vi.fn();
+  public resume = vi.fn();
+
+  constructor(call: Call) {
+    super(call, new TestInputMediaDeviceManagerState());
+  }
+}
+
+describe('InputMediaDeviceManager.test', () => {
+  let manager: TestInputMediaDeviceManager;
+
+  beforeEach(() => {
+    manager = new TestInputMediaDeviceManager(
+      new Call({
+        id: '',
+        type: '',
+        streamClient: new StreamClient('abc123'),
+        clientStore: new StreamVideoWriteableStateStore(),
+      }),
+    );
+  });
+
+  it('list devices', () => {
+    const spy = vi.fn();
+    manager.listDevices().subscribe(spy);
+
+    expect(spy).toHaveBeenCalledWith(mockVideoDevices);
+  });
+
+  it('enable device - before joined to call', async () => {
+    vi.spyOn(manager, 'getStream');
+
+    await manager.enable();
+
+    expect(manager.getStream).toHaveBeenCalledWith({
+      deviceId: undefined,
+    });
+
+    expect(manager.state.mediaStream).toBeDefined();
+    expect(manager.state.status).toBe('enabled');
+  });
+
+  it('enable device - after joined to call', async () => {
+    // @ts-expect-error
+    manager['call'].state.callingState = CallingState.JOINED;
+
+    await manager.enable();
+
+    expect(manager.publishStream).toHaveBeenCalledWith(
+      manager.state.mediaStream,
+    );
+  });
+
+  it('enable device should set device id', async () => {
+    expect(manager.state.selectedDevice).toBeUndefined();
+
+    await manager.enable();
+
+    expect(manager.state.selectedDevice).toBeDefined();
+  });
+
+  it('disable device - before joined to call', async () => {
+    await manager.disable();
+
+    expect(manager.state.mediaStream).toBeUndefined();
+    expect(manager.state.status).toBe('disabled');
+  });
+
+  it('disable camera - after joined to call', async () => {
+    // @ts-expect-error
+    manager['call'].state.callingState = CallingState.JOINED;
+    await manager.enable();
+
+    await manager.disable();
+
+    expect(manager.stopPublishStream).toHaveBeenCalledWith();
+  });
+
+  it('toggle device', async () => {
+    vi.spyOn(manager, 'disable');
+    vi.spyOn(manager, 'enable');
+
+    await manager.toggle();
+
+    expect(manager.enable).toHaveBeenCalled();
+
+    await manager.toggle();
+
+    expect(manager.disable).toHaveBeenCalled();
+  });
+
+  it('select device when status is disabled', async () => {
+    const deviceId = mockVideoDevices[0].deviceId;
+    await manager.select(deviceId);
+
+    expect(manager.state.selectedDevice).toBe(deviceId);
+    expect(manager.getStream).not.toHaveBeenCalledWith();
+    expect(manager.publishStream).not.toHaveBeenCalled();
+  });
+
+  it('select device when status is enabled and in call', async () => {
+    // @ts-expect-error
+    manager['call'].state.callingState = CallingState.JOINED;
+    await manager.enable();
+
+    const deviceId = mockVideoDevices[1].deviceId;
+    await manager.select(deviceId);
+
+    expect(manager.stopPublishStream).toHaveBeenCalledWith();
+    expect(manager.getStream).toHaveBeenCalledWith({
+      deviceId,
+    });
+    expect(manager.publishStream).toHaveBeenCalled();
+  });
+
+  it(`changing media stream constraints shouldn't toggle status`, async () => {
+    await manager.enable();
+    const spy = vi.fn();
+    manager.state.status$.subscribe(spy);
+
+    expect(spy.mock.calls.length).toBe(1);
+
+    const deviceId = mockVideoDevices[1].deviceId;
+    await manager.select(deviceId);
+
+    expect(spy.mock.calls.length).toBe(1);
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+    vi.resetModules();
+  });
+});

package/src/devices/__tests__/MicrophoneManager.test.ts

@@ -0,0 +1,103 @@
+import { Call } from '../../Call';
+import { StreamClient } from '../../coordinator/connection/client';
+import { CallingState, StreamVideoWriteableStateStore } from '../../store';
+
+import { afterEach, beforeEach, describe, vi, it, expect } from 'vitest';
+import { mockCall, mockAudioDevices, mockAudioStream } from './mocks';
+import { getAudioStream } from '../devices';
+import { TrackType } from '../../gen/video/sfu/models/models';
+import { MicrophoneManager } from '../MicrophoneManager';
+import { of } from 'rxjs';
+
+vi.mock('../devices.ts', () => {
+  console.log('MOCKING devices API');
+  return {
+    disposeOfMediaStream: vi.fn(),
+    getAudioDevices: vi.fn(() => {
+      return of(mockAudioDevices);
+    }),
+    getAudioStream: vi.fn(() => Promise.resolve(mockAudioStream())),
+  };
+});
+
+vi.mock('../../Call.ts', () => {
+  console.log('MOCKING Call');
+  return {
+    Call: vi.fn(() => mockCall()),
+  };
+});
+
+describe('MicrophoneManager', () => {
+  let manager: MicrophoneManager;
+
+  beforeEach(() => {
+    manager = new MicrophoneManager(
+      new Call({
+        id: '',
+        type: '',
+        streamClient: new StreamClient('abc123'),
+        clientStore: new StreamVideoWriteableStateStore(),
+      }),
+    );
+  });
+  it('list devices', () => {
+    const spy = vi.fn();
+    manager.listDevices().subscribe(spy);
+
+    expect(spy).toHaveBeenCalledWith(mockAudioDevices);
+  });
+
+  it('get stream', async () => {
+    await manager.enable();
+
+    expect(getAudioStream).toHaveBeenCalledWith({
+      deviceId: undefined,
+    });
+  });
+
+  it('should get device id from stream', async () => {
+    expect(manager.state.selectedDevice).toBeUndefined();
+
+    await manager.enable();
+
+    expect(manager.state.selectedDevice).toBeDefined();
+  });
+
+  it('publish stream', async () => {
+    // @ts-expect-error
+    manager['call'].state.callingState = CallingState.JOINED;
+
+    await manager.enable();
+
+    expect(manager['call'].publishAudioStream).toHaveBeenCalledWith(
+      manager.state.mediaStream,
+    );
+  });
+
+  it('stop publish stream', async () => {
+    // @ts-expect-error
+    manager['call'].state.callingState = CallingState.JOINED;
+    await manager.enable();
+
+    await manager.disable();
+
+    expect(manager['call'].stopPublish).toHaveBeenCalledWith(TrackType.AUDIO);
+  });
+
+  it('should pause and resume tracks', async () => {
+    await manager.enable();
+
+    manager.pause();
+
+    expect(manager.state.mediaStream?.getAudioTracks()[0].enabled).toBe(false);
+
+    manager.resume();
+
+    expect(manager.state.mediaStream?.getAudioTracks()[0].enabled).toBe(true);
+  });
+
+  afterEach(() => {
+    vi.clearAllMocks();
+    vi.resetModules();
+  });
+});

package/src/devices/__tests__/mocks.ts

@@ -0,0 +1,98 @@
+import { vi } from 'vitest';
+import { CallingState } from '../../store';
+
+export const mockVideoDevices = [
+  {
+    deviceId:
+      '9d7b77d613cc935c023c08779a714db96e9f6d5589aae20869b5ab6e42f5b1fe',
+    kind: 'videoinput',
+    label: 'Logi Capture',
+    groupId: '81b3a3c5fec920079136100dc4b185209859077ce622a24fec747406d50cd694',
+  },
+  {
+    deviceId:
+      'af5cbd8fa1ff57b16f5f3c2c03dd9502f552cbdada3992a5c10b8d240debf1b5',
+    kind: 'videoinput',
+    label: 'HD Pro Webcam C920 (046d:08e5)',
+    groupId: 'bb0a866e4d66d493a104d7bd5a5dc2fee3d5947fab34aa0a99282386556a8f17',
+  },
+  {
+    deviceId:
+      'f66cf2801fa16223e46a65be7d8d98d23670dd16fdd8961dd5c0dbb0cad372f3',
+    kind: 'videoinput',
+    label: 'FaceTime HD Camera (Built-in) (05ac:8514)',
+    groupId: '0387adca5bc7ab2850a9b9594a5622d838de4f78cbdf4d31c3506b701c58d94d',
+  },
+] as MediaDeviceInfo[];
+
+export const mockAudioDevices = [
+  {
+    deviceId: 'default',
+    kind: 'audioinput',
+    label: 'Default - MacBook Pro Microphone (Built-in)',
+    groupId: 'a8708545cb3969c0b7e3712d2ffdbc381992aeb5577b06cd71ba7a94ee20cf3e',
+  },
+  {
+    deviceId:
+      '6ce9fde261809389d6476791d329695ea4c98bd432ac5f6a60e7017c96943d32',
+    kind: 'audioinput',
+    label: 'iPhone Microphone',
+    groupId: '65a8661fe6575d0eb180e7ab3f1ec887a285965293b9e75ceed938766f6d32bd',
+  },
+  {
+    deviceId:
+      'bb784adda6f0199966c97f8a2ca0fb93169e55cae050e8e8dd4ef76ffd1e638d',
+    kind: 'audioinput',
+    label: 'HD Pro Webcam C920 (046d:08e5)',
+    groupId: 'bb0a866e4d66d493a104d7bd5a5dc2fee3d5947fab34aa0a99282386556a8f17',
+  },
+  {
+    deviceId:
+      '45b2467601574a522fe96048a5b2122ea6be0a478e04b990eaa4d93b49e2428a',
+    kind: 'audioinput',
+    label: 'MacBook Pro Microphone (Built-in)',
+    groupId: 'a8708545cb3969c0b7e3712d2ffdbc381992aeb5577b06cd71ba7a94ee20cf3e',
+  },
+  {
+    deviceId:
+      'b936c0572d3536857d646af780b8704c368a872e7ba8138ef83d72d726710975',
+    kind: 'audioinput',
+    label: 'ZoomAudioDevice (Virtual)',
+    groupId: '423bb83eab8607fe47313f2e0307600c40e03c37ad63a3b8412d3d5eb0671a55',
+  },
+] as MediaDeviceInfo[];
+
+export const mockCall = () => {
+  return {
+    state: {
+      callingState: CallingState.IDLE,
+    },
+    publishVideoStream: vi.fn(),
+    publishAudioStream: vi.fn(),
+    stopPublish: vi.fn(),
+  };
+};
+
+export const mockAudioStream = () => {
+  const track = {
+    getSettings: () => ({
+      deviceId: mockAudioDevices[0].deviceId,
+    }),
+    enabled: true,
+  };
+  return {
+    getAudioTracks: () => [track],
+  } as MediaStream;
+};
+
+export const mockVideoStream = () => {
+  const track = {
+    getSettings: () => ({
+      deviceId: mockVideoDevices[0].deviceId,
+    }),
+    enabled: true,
+  };
+  return {
+    getVideoTracks: () => [track],
+  } as MediaStream;
+};

package/src/devices/index.ts

@@ -1 +1,5 @@
 export * from './devices';
+export * from './InputMediaDeviceManager';
+export * from './InputMediaDeviceManagerState';
+export * from './CameraManager';
+export * from './MicrophoneManager';