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>
This commit is contained in:
parent
a780041840
commit
92a3e2eba3
10
src/index.ts
10
src/index.ts
|
|
@ -70,7 +70,7 @@ class CdpSession {
|
||||||
async captureScreenshot(format: string = 'png'): Promise<Buffer> {
|
async captureScreenshot(format: string = 'png'): Promise<Buffer> {
|
||||||
const res = await this.send('Page.captureScreenshot', {
|
const res = await this.send('Page.captureScreenshot', {
|
||||||
format,
|
format,
|
||||||
captureBeyondViewport: true,
|
captureBeyondViewport: false,
|
||||||
});
|
});
|
||||||
return Buffer.from(res.data, 'base64');
|
return Buffer.from(res.data, 'base64');
|
||||||
}
|
}
|
||||||
|
|
@ -99,19 +99,21 @@ async function scrollAndCapture(
|
||||||
) || 0;
|
) || 0;
|
||||||
const viewportHeight: number = await cdp.evaluate('window.innerHeight') || 900;
|
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 scrollY = 0;
|
||||||
let idx = 1;
|
let idx = 1;
|
||||||
while (scrollY < pageHeight) {
|
while (scrollY < pageHeight) {
|
||||||
await cdp.evaluate(`window.scrollTo(0, ${scrollY})`);
|
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 buf = await cdp.captureScreenshot('png');
|
||||||
const filePath = path.join(outputDir, `page_${String(idx).padStart(3, '0')}.png`);
|
const filePath = path.join(outputDir, `page_${String(idx).padStart(3, '0')}.png`);
|
||||||
fs.writeFileSync(filePath, buf);
|
fs.writeFileSync(filePath, buf);
|
||||||
saved.push(filePath);
|
saved.push(filePath);
|
||||||
|
|
||||||
scrollY += viewportHeight;
|
scrollY += step;
|
||||||
idx++;
|
idx++;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue