fix frame order

jperl · jperl · commit a8ade619cd4a · 2020-05-29T11:15:54.000-06:00
diff --git a/src/PageVideoCapture.ts b/src/PageVideoCapture.ts
@@ -76,7 +76,7 @@ export class PageVideoCapture {
     // write the previous frame based on the duration between it and the current frame
     if (this._previousFrame) {
       const durationSeconds =
-        (currentFrame.received - this._previousFrame.received) / 1000;
+        currentFrame.timestamp - this._previousFrame.timestamp;
       this._writer.write(this._previousFrame.data, durationSeconds);
     }
 
@@ -88,7 +88,8 @@ export class PageVideoCapture {
 
     // write the final frame based on the duration between it and now
     debug('write final frame');
-    const durationSeconds = (Date.now() - this._previousFrame.received) / 1000;
+    const durationSeconds =
+      (Date.now() - this._previousFrame.timestamp * 1000) / 1000;
     this._writer.write(this._previousFrame.data, durationSeconds);
   }
 
diff --git a/src/VideoWriter.ts b/src/VideoWriter.ts
@@ -72,7 +72,10 @@ export class VideoWriter extends EventEmitter {
   public write(data: Buffer, durationSeconds = 1): void {
     this._receivedFrame = true;
 
-    const numFrames = Math.round(durationSeconds * this._framesPerSecond);
+    const numFrames = Math.max(
+      Math.round(durationSeconds * this._framesPerSecond),
+      1,
+    );
     debug(`write ${numFrames} frames for duration ${durationSeconds}s`);
 
     for (let i = 0; i < numFrames; i++) {
diff --git a/tests/saveVideo.test.ts b/tests/saveVideo.test.ts
@@ -19,7 +19,12 @@ describe('saveVideo', () => {
     const savePath = join(tmpdir(), `${Date.now()}.mp4`);
 
     const capture = await saveVideo(page, savePath);
-    await page.setContent('<html>hello world</html>');
+
+    for (let i = 0; i < 10; i++) {
+      await page.setContent(`<html>hello world ${i}</html>`);
+      await new Promise((r) => setTimeout(r, 100));
+    }
+
     await capture.stop();
 
     const videoPathExists = await pathExists(savePath);
