From 92a3e2eba3cd9c9ea99ca7de481ed40855840882 Mon Sep 17 00:00:00 2001
From: ywkj <tabvim.dev@gmail.com>
Date: Mon, 30 Mar 2026 12:23:00 +0800
Subject: [PATCH] fix: capture viewport-only screenshots for readable
 resolution

captureBeyondViewport was capturing the entire page in one giant image
(2804x20746), making text unreadable. Now captures per-viewport with
80% overlap, producing ~2400x1992 screenshots that vision can read.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/index.ts | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/index.ts b/src/index.ts
index 22e9b03..bea54f0 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -70,7 +70,7 @@ class CdpSession {
   async captureScreenshot(format: string = 'png'): Promise<Buffer> {
     const res = await this.send('Page.captureScreenshot', {
       format,
-      captureBeyondViewport: true,
+      captureBeyondViewport: false,
     });
     return Buffer.from(res.data, 'base64');
   }
@@ -99,19 +99,21 @@ async function scrollAndCapture(
   ) || 0;
   const viewportHeight: number = await cdp.evaluate('window.innerHeight') || 900;
 
-  // Scroll through the page and capture screenshots
+  // Scroll through the page and capture viewport-sized screenshots
+  // Use 80% step to overlap slightly and avoid missing content at boundaries
+  const step = Math.floor(viewportHeight * 0.8);
   let scrollY = 0;
   let idx = 1;
   while (scrollY < pageHeight) {
     await cdp.evaluate(`window.scrollTo(0, ${scrollY})`);
-    await new Promise(r => setTimeout(r, 500)); // wait for render
+    await new Promise(r => setTimeout(r, 800)); // wait for lazy-load render
 
     const buf = await cdp.captureScreenshot('png');
     const filePath = path.join(outputDir, `page_${String(idx).padStart(3, '0')}.png`);
     fs.writeFileSync(filePath, buf);
     saved.push(filePath);
 
-    scrollY += viewportHeight;
+    scrollY += step;
     idx++;
   }