如何使用 JEST 模拟视频暂停功能？

Posted 2023-02-22

【中文标题】如何使用 JEST 模拟视频暂停功能？

【英文标题】：How to mock video pause function using JEST?

【发布时间】：2019-01-20 14:18:55

【问题描述】：

在我的组件中，我有这样的代码：

this.videoRef.current.pause();

videoRef 是 <video ref=this.videoRef autoPlay muted > ...

当 Is pause 在测试中达到时，我收到错误：

 Error: Not implemented: htmlMediaElement.prototype.pause

如何模拟暂停功能？

    const wrapper = mount(<ComponentWithVideoTag />);

    const el = wrapper.find('video').props();
    Object.defineProperty(el, 'paused', 
        writable: true,
        value: jest.fn(),
    );

不适合我。

【参考方案1】：

我不会担心尝试模拟特定元素上的道具，只需模拟正在调用的更高级别的 API。您可以使用 spyOn 实现此目的，只需确保之后在存根上调用 mockRestore（以防万一您在文件的其他地方需要它）。

const pauseStub = jest
  .spyOn(window.HTMLMediaElement.prototype, 'pause')
  .mockImplementation(() => )
const wrapper = mount(<ComponentWithVideoTag />);
// trigger the code that you would expect to call the pause function
expect(pauseStub).toHaveBeenCalled()
pauseStub.mockRestore()