mock-mediaDevices

overview

WebAPI window.navigator.mediaDevices のモックを生成

Usage

以下の構成で説明する

setup

まずjsdomを用いて、nodejsで動作可能なwindow.navigatorを生成し、mockMediaDevices()によって生成されるmediaDevicesオブジェクトをwindow.navigatorへ登録するセットアップモジュールを作成する

test/setup.ts

// test/setup.ts

import jsdom from "jsdom";
import { mockMediaDevices } from "@rksan/mock-media-devices";

const { JSDOM } = jsdom;
const dom = new JSDOM(`<!DOCTYPE html>`);

const fakeMediaDevices = mockMediaDevices();

// nodejs
globalThis.navigator ??= dom.window.navigator;

if(Object.prototype.hasOwnProperty.call(navigator, "mediaDevices")){
  Object.defineProperty(navigator, "mediaDevices". {value: fakeMediaDevices})
}

With test runner

次に、テストコード内でtest/setup.tsを呼び出してテストコードを実行する

// test/index.spec.ts

import { describe, it } from "mocha";
import { assert } from "chai";

// call setup module
import "test/setup.ts";

// Implementation of test runner
describe("unit testing...", () => {
  it("mediaDevices", (done) => {
    navigator.mediaDevices
      .getUserMedia({ video: true })
      .then((stream) => {
        // test codes ...
        done();
      })
      .catch((err) => {
        done(err);
      });
  });
});

install

npm i -D @rksan/mock-media-devices

Requirement

Node.js - v18.x

syntax

const mediaDevices: MediaDevices =
  mockMediaDevices(deviceInfos?: MediaDeviceInfo[])

arguments

`deviceInfos?`

MediaDeviceInfo | MDN の配列。

@type MediaDeviceInfo[]

@default 次に記載

[
  {
    deviceId: UUID, // *1
    groupId: UUID,
    kind: "videoinput",
    label: "mock-videoinput-device",
  },
  {
    deviceId: UUID,
    groupId: UUID,
    kind: "audioinput",
    label: "mock-audioinput-device",
  },
  {
    deviceId: UUID,
    groupId: UUID,
    kind: "audiooutput",
    label: "mock-audiooutput-device",
  },
];

*1 UUDD は nodejs 標準パッケージ crypto.randomUUID() にて生成される

Reference

navigator.mediaDevices | MDN

Author

@rksan https://github.com/rksan | github

Licence

MIT

rksan/mock-mediaDevices