Question

我正在尝试使用Jest框架运行单元测试。我的项目中有一些用打字稿编写的与webrtc相关的代码。

我不断收到此错误。我尝试模拟MediaStream，但无济于事。

我的测试文件：

import * as React from "react";
import * as renderer from 'react-test-renderer';
import { Provider } from 'react-redux';
const configureStore = require('redux-mock-store');


import App from '../App';
import mockData from "../mockData";
const mockStore = configureStore();

describe('Tests related to App', () => {
    it('Capturing Snapshot of App', () => {
        let store = mockStore(mockData.getStore());
        const renderedValue = renderer.create(<Provider store={store}><App /></Provider>).toJSON();;
        expect(renderedValue).toMatchSnapshot();
    });
})

我了解MediaStream是平台级的属性。所以我试着嘲笑，让Jest理解，但无济于事。

我的模拟代码。

let mediaStream = {
        getVideoTracks: function() {
            return [];
        }
    }

    const mediaDevicesMock = {
        getUserMedia: jest.fn(() => { return Promise.resolve(mediaStream)})
      };

    global.navigator.mediaDevices = mediaDevicesMock;

我可能在多个层面上都是错的，任何建议和纠正都值得欢迎。我试图弄清这个link的含义，但是没有多少可以弄清楚的。

最新版本：“ ^ 22.1.4”

Answer 1

为了通过这样的测试，我模拟了 MediaRecorder：

Object.defineProperty(window, 'MediaRecorder', {
    writable: true,
    value: jest.fn().mockImplementation((query) => ({
        start: jest.fn(),
        ondataavailable: jest.fn(),
        onerror: jest.fn(),
        state: '',
        stop: jest.fn()
    }))
});

此外，我还嘲笑了 isTypeSupported 方法：

Object.defineProperty(MediaRecorder, 'isTypeSupported', {
    writable: true,
    value: () => true
});

Answer 2

mediaDevices接口尚未在JSDOM中实现。您可能可以使用其官方文档中的以下代码存根来模拟它：https://jestjs.io/docs/en/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom

ReferenceError：未定义MediaStream-在带有Jest的unitTest中

2 个答案: