using puppeteer-recorder to record video of browser

Question

I'm trying to record puppeteer to see what happens when i run it on server, as I understand this package does what i want.

https://www.npmjs.com/package/puppeteer-recorder

so here is simplified version of my code

const puppeteer = require('puppeteer');
const { record } = require('puppeteer-recorder');
var path = 'C:\\wamp64\\www\\home_robot\\';

init_puppeteer();

const global_browser  ; 
async function init_puppeteer() {

        global_browser = await puppeteer.launch({headless: false , args: ['--no-sandbox', '--disable-setuid-sandbox']});

    check_login()
};

async function check_login()
{
    try {
        const page = await global_browser.newPage();
        await page.setViewport({width: 1000, height: 1100});

        await record({
            browser: global_browser, // Optional: a puppeteer Browser instance,
            page: page, // Optional: a puppeteer Page instance,
            output: path + 'output.webm',
            fps: 60,
            frames: 60 * 5, // 5 seconds at 60 fps
        prepare: function () {}, // <-- add this line
        render: function () {} // <-- add this line

        });

        await page.goto('https://www.example.cob', {timeout: 60000})
            .catch(function (error) {
                throw new Error('TimeoutBrows');
            });

        await page.close();
    }
    catch (e) {
        console.log(' LOGIN ERROR ---------------------');
        console.log(e);
    }
}

But I get this error

    $ node home.js
(node:7376) UnhandledPromiseRejectionWarning: Error: spawn ffmpeg ENOENT
    at Process.ChildProcess._handle.onexit (internal/child_process.js:240:19)
    at onErrorNT (internal/child_process.js:415:16)
    at process._tickCallback (internal/process/next_tick.js:63:19)
(node:7376) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This
error originated either by throwing inside of an async function without a catch
block, or by rejecting a promise which was not handled with .catch(). (rejection
 id: 1)
(node:7376) [DEP0018] DeprecationWarning: Unhandled promise rejections are depre
cated. In the future, promise rejections that are not handled will terminate the
 Node.js process with a non-zero exit code.
 LOGIN ERROR ---------------------
Error [ERR_STREAM_DESTROYED]: Cannot call write after a stream was destroyed
    at doWrite (_stream_writable.js:406:19)
    at writeOrBuffer (_stream_writable.js:394:5)
    at Socket.Writable.write (_stream_writable.js:294:11)
    at Promise (C:\wamp64\www\home_robot\node_modules\puppeteer-recorder\index.j
s:72:12)
    at new Promise (<anonymous>)
    at write (C:\wamp64\www\home_robot\node_modules\puppeteer-recorder\index.js:
71:3)
    at module.exports.record (C:\wamp64\www\home_robot\node_modules\puppeteer-re
corder\index.js:44:11)
    at process._tickCallback (internal/process/next_tick.js:68:7)

i've even ran npm i reinstall ffmpeg --with-libvpx as it was suggested here

https://github.com/clipisode/puppeteer-recorder/issues/6

but still didnt work .... wha telse do i need to do ?

Answer 1

Add two empty functions called prepare and render in the options.

await record({
  browser: global_browser, // Optional: a puppeteer Browser instance,
  page, // Optional: a puppeteer Page instance,
  output: path + 'output.webm',
  fps: 60,
  frames: 60 * 5, // 5 seconds at 60 fps,
  prepare: function () {}, // <-- add this line
  render: function () {} // <-- add this line
});

Basically it's missing some default functions and the error is not handled properly.

Answer 2

I know this would be a very late response to your question, but nevertheless.

A years ago, I visited this same stack-overflow thread and I had similar challenge of finding a screen recorder library which does a good job a capturing the video as well as offers an options to manually start and stop the recording.

Finally I wrote one for myself and distributed as NPM library...!!

https://www.npmjs.com/package/puppeteer-screen-recorder

Hope this is helpful...!!