Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

timeSlice doesn't work with default webpack config

See original GitHub issue

Description

Timeslice doesn’t work with default webpack config.

Steps to reproduce

Install default webpack config. Add timeslice to the config. Begin recording and watch console log.

Results

Expected

Expected to see stored blobs when timeslices are hit.

Actual

No recording is done and there is an error.

Error output

video.es.js:117 VIDEOJS: ERROR: ReferenceError: MediaStreamRecorder is not defined
    at Record.onTimeStamp (videojs.record.js:3202)
    at updateTimeStamp (RecordRTC.js:2216)
    at MediaStreamRecorder.record (RecordRTC.js:2190)
    at initRecorder (RecordRTC.js:94)
    at Object.startRecording (RecordRTC.js:74)
    at MRecordRTC.startRecording (RecordRTC.js:1202)
    at RecordRTCEngine.start (videojs.record.js:1335)
    at Record.startRecording (videojs.record.js:2445)
    at Player.eval (videojs.record.js:2411)
    at HTMLDivElement.bound (video.es.js:2093)

Additional Information

Please include any additional information necessary here. Including the following:

versions

Latest

videojs

Latest

browsers

Google Chrome, haven’t tested Firefox

OSes

Ubuntu 18.04

I have managed to get around the error by adding an additional line to the ProvidePlugin

 MediaStreamRecorder: 'msr'

However, despite not getting an error I now see nothing in the recordedData blobs when the time slice hits. Saving at the end of a recording still works fine, but no blobs are created until the recording is finished.

Issue Analytics

State:
Created 5 years ago
Comments:5 (5 by maintainers)

Top GitHub Comments

2reactions

thijstriemstracommented, Sep 9, 2018

Figured it out and updated the wiki page. Basically add this MediaStreamRecorder reference here:

new webpack.ProvidePlugin({
            videojs: 'video.js/dist/video.cjs.js',
            RecordRTC: 'recordrtc',
            MediaStreamRecorder: ['recordrtc', 'MediaStreamRecorder']
        })

1reaction

GDIBasscommented, Sep 5, 2018

Yes of course. I’ll be back in front of my desktop in an hour or two and I’ll post the versions then.

Top Results From Across the Web

Webpack ignores webpack.config.js - Stack Overflow

Thank you, but unfortunately It doesn't work. It still shows that mode attribute has not been set and when I change entry path...

Configuration - webpack

Out of the box, webpack won't require you to use a configuration file. ... webpack applies configuration defaults after plugins defaults are applied....

Production | webpack

In this guide, we'll dive into some of the best practices and utilities for building a production site or application.

Resolve | webpack

These options change how modules are resolved. Webpack provides reasonable defaults, but it is possible to change the resolving in detail.

Optimization - webpack

By default optimization.concatenateModules is enabled in production mode and disabled elsewise. webpack.config.js module.exports = ...