tessl/npm-capture-website

Capture screenshots of websites using Puppeteer with extensive customization options

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Overview

Eval results

Files

Screenshot Capture Methods

Name: tessl/npm-capture-website
Author: tessl

Core screenshot capture functionality providing three output formats for different use cases.

Capabilities

File Method

Captures a screenshot and saves it directly to the file system. Creates intermediate directories automatically.

/**
 * Capture a screenshot and save it to the given file path
 * @param input - URL, file URL, data URL, local file path, or HTML content
 * @param outputFilePath - Path where the screenshot will be saved
 * @param options - Screenshot configuration options
 * @returns Promise that resolves when file is written
 */
function file(
  input: string,
  outputFilePath: string,
  options?: FileOptions
): Promise<void>;

interface FileOptions extends Options {
  /** Overwrite existing file instead of throwing error */
  overwrite?: boolean;
}

Usage Examples:

import captureWebsite from 'capture-website';

// Basic file capture
await captureWebsite.file('https://example.com', 'screenshot.png');

// With overwrite protection
await captureWebsite.file('https://example.com', 'screenshot.png', {
  overwrite: false // default - will throw if file exists
});

// Complex file capture with options
await captureWebsite.file('https://example.com', 'screenshots/full-page.png', {
  fullPage: true,
  type: 'jpeg',
  quality: 0.9,
  width: 1920,
  height: 1080,
  overwrite: true
});

// Capture HTML content
await captureWebsite.file('<h1>Hello World</h1>', 'html-screenshot.png', {
  inputType: 'html',
  width: 800,
  height: 600
});

Buffer Method

Captures a screenshot and returns it as a binary buffer for further processing or manipulation.

/**
 * Capture a screenshot and return as binary buffer
 * @param input - URL, file URL, data URL, local file path, or HTML content
 * @param options - Screenshot configuration options
 * @returns Promise resolving to Uint8Array buffer
 */
function buffer(input: string, options?: Options): Promise<Uint8Array>;

Usage Examples:

import captureWebsite from 'capture-website';
import fs from 'fs/promises';

// Basic buffer capture
const buffer = await captureWebsite.buffer('https://example.com');

// Process buffer further
const jpegBuffer = await captureWebsite.buffer('https://example.com', {
  type: 'jpeg',
  quality: 0.8
});

// Save buffer manually
await fs.writeFile('manual-save.png', buffer);

// Use buffer with image processing libraries
const processedBuffer = await someImageProcessor(buffer);

Base64 Method

Captures a screenshot and returns it as a base64-encoded string, useful for embedding in HTML or APIs.

/**
 * Capture a screenshot and return as base64 string
 * @param input - URL, file URL, data URL, local file path, or HTML content
 * @param options - Screenshot configuration options
 * @returns Promise resolving to base64 encoded string
 */
function base64(input: string, options?: Options): Promise<string>;

Usage Examples:

import captureWebsite from 'capture-website';

// Basic base64 capture
const base64String = await captureWebsite.base64('https://example.com');

// Embed in HTML
const htmlImg = `<img src="data:image/png;base64,${base64String}" />`;

// Send via API
const response = await fetch('/api/screenshots', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ screenshot: base64String })
});

// JPEG base64 with quality control
const compressedBase64 = await captureWebsite.base64('https://example.com', {
  type: 'jpeg',
  quality: 0.6
});

Input Types

All capture methods accept various input formats:

URL Input (Default)

// HTTP/HTTPS URLs
await captureWebsite.file('https://example.com', 'screenshot.png');
await captureWebsite.file('http://localhost:3000', 'local.png');

// File URLs
await captureWebsite.file('file:///path/to/local.html', 'file.png');

// Data URLs
await captureWebsite.file('data:text/html,<h1>Hello</h1>', 'data.png');

Local File Paths

// Local HTML files (automatically converted to file:// URLs)
await captureWebsite.file('index.html', 'local-page.png');
await captureWebsite.file('./dist/index.html', 'built-page.png');

HTML Content

// Raw HTML content
await captureWebsite.file('<h1>Dynamic Content</h1>', 'html.png', {
  inputType: 'html'
});

// Complex HTML with styling
const htmlContent = `
  <html>
    <head><style>body { font-family: Arial; }</style></head>
    <body><h1>Styled Content</h1></body>
  </html>
`;

await captureWebsite.file(htmlContent, 'styled.png', {
  inputType: 'html'
});

Error Handling

Common error scenarios and handling patterns:

try {
  await captureWebsite.file('https://example.com', 'screenshot.png');
} catch (error) {
  if (error.code === 'EEXIST') {
    // File already exists (when overwrite: false)
    console.log('File already exists');
  } else if (error.message.includes('timeout')) {
    // Page load timeout
    console.log('Page took too long to load');
  } else if (error.message.includes('net::')) {
    // Network error
    console.log('Network error occurred');
  }
}

Install with Tessl CLI