tungs / timecut

Node.js program to record smooth movies of web pages with JavaScript animations
BSD 3-Clause "New" or "Revised" License
623 stars 72 forks source link

One half of video was black. #20

Open JenishaDalin opened 4 years ago

JenishaDalin commented 4 years ago

Hi, @tungs I had recorded canvas using timecut. But result was not full video, one half of video is blank, And it started to play after some time. How to sync video start time with this module?

Cc : @varunarora

tungs commented 4 years ago

Hi @JenishaDalin, could you post a simplest example of the web page you're trying to capture, the command you're trying to use, and a screenshot of the half-blank video? It's very hard to understand what the issue is with the information you've provided.

vasanthudhaya commented 4 years ago

Hi, @tungs i loaded a video element and fabric sprite image in a fabric canvas. Am facing a black issue of the first frame of output video when am render using timecut. So i give an url for your testing. And let me know how to resolve.

Ref url: https://poc.netaxis.co/video

timecut({
    headless: true,
    ignoreHTTPSErrors: false,  
    executablePath: '/usr/bin/google-chrome',
    launchArguments : [
      '--enable-usermedia-screen-capturing', 
      '--allow-http-screen-capture',
      '--no-sandbox',
      '--auto-select-desktop-capture-source=pickme',
      '--disable-setuid-sandbox'
    ],
    url: 'https://poc.netaxis.co/video',
    Width: 1080,
    Height: 1080,
    outputOptions : ['-vf', 'scale=1080:1080'],
    viewport: {
      width: 1920,
      height: 900,
      isLandscape : true,
    },
    preparePage : function(page) {
        page.tap('#playbtn');
    },
    pipeMode : false,
    canvasCaptureMode : true,
    selector: '#vdo_canvas',     // crops each frame to the bounding box of '#container'
    fps: 24,                    // saves 30 frames for each virtual second
    duration: 20,               // for 20 virtual seconds 
    output: 'video.mp4'         // to video.mp4 of the current working directory
  }).then(function () {
    console.log('done');
  }).catch(function(e) {
    console.log(e);
  })

cc: @varunarora