w
Dokumentation Kernwerkzeuge Screenshot Tool

API Reference

The Screenshot Tool provides a comprehensive API for programmatic access to screenshot functionality. This reference covers all available methods, parameters, and return values.

Core API Methods

captureScreenshot(options)

Captures a screenshot with the specified options.

Parameters:

  • options (Object): Configuration options for the screenshot
    • mode (String): Capture mode - 'fullscreen' or 'visible'
    • format (String): Image format - 'png', 'jpeg', or 'webp'
    • quality (Number): Image quality for JPEG (10-100, default: 90)
    • includeCursor (Boolean): Include mouse cursor (default: false)

Returns:

  • Promise<Object>: Screenshot result object
    • dataUrl (String): Base64 encoded image data
    • dimensions (Object): Image dimensions
      • width (Number): Image width in pixels
      • height (Number): Image height in pixels
    • size (String): Human-readable file size
    • format (String): Image format used
    • timestamp (Number): Capture timestamp

Example:

const result = await captureScreenshot({
  mode: 'visible',
  format: 'png',
  includeCursor: false,
});

console.log(result.dimensions); // { width: 1920, height: 1080 }
console.log(result.size); // "2.5 MB"

downloadScreenshot(dataUrl, filename)

Downloads a screenshot to the user's device.

Parameters:

  • dataUrl (String): Base64 encoded image data
  • filename (String): Desired filename (optional)

Returns:

  • void

Example:

const result = await captureScreenshot({ mode: 'fullscreen' });
downloadScreenshot(result.dataUrl, 'my-screenshot.png');

copyToClipboard(dataUrl)

Copies a screenshot to the system clipboard.

Parameters:

  • dataUrl (String): Base64 encoded image data

Returns:

  • Promise<Boolean>: Success status

Example:

const result = await captureScreenshot({ mode: 'visible' });
const success = await copyToClipboard(result.dataUrl);
if (success) {
  console.log('Screenshot copied to clipboard');
}

History Management API

getScreenshotHistory()

Retrieves the current screenshot history.

Returns:

  • Array<Object>: Array of screenshot history items
    • id (String): Unique identifier
    • filename (String): Original filename
    • imageData (String): Base64 encoded image data
    • dimensions (String): Human-readable dimensions
    • size (String): Human-readable file size
    • format (String): Image format
    • timestamp (Number): Capture timestamp

Example:

const history = getScreenshotHistory();
console.log(`Found ${history.length} screenshots in history`);

addToHistory(screenshotData)

Adds a screenshot to the history.

Parameters:

  • screenshotData (Object): Screenshot data object
    • filename (String): Screenshot filename
    • imageData (String): Base64 encoded image data
    • dimensions (String): Human-readable dimensions
    • size (String): Human-readable file size
    • format (String): Image format

Returns:

  • String: Generated unique identifier

Example:

const id = addToHistory({
  filename: 'custom-screenshot.png',
  imageData: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...',
  dimensions: '1920x1080',
  size: '2.5 MB',
  format: 'png',
});

removeFromHistory(id)

Removes a screenshot from the history.

Parameters:

  • id (String): Unique identifier of the screenshot to remove

Returns:

  • Boolean: Success status

Example:

const success = removeFromHistory('screenshot-123');
if (success) {
  console.log('Screenshot removed from history');
}

clearHistory()

Clears all screenshots from the history.

Returns:

  • void

Example:

clearHistory();
console.log('All screenshots cleared from history');

Utility Functions

formatFileSize(bytes)

Formats a file size in bytes to a human-readable string.

Parameters:

  • bytes (Number): File size in bytes

Returns:

  • String: Formatted file size (e.g., "2.5 MB")

Example:

const size = formatFileSize(2621440); // "2.5 MB"

formatTime(timestamp)

Formats a timestamp to a human-readable date string.

Parameters:

  • timestamp (Number): Unix timestamp in milliseconds

Returns:

  • String: Formatted date string

Example:

const time = formatTime(Date.now()); // "2024-01-15 14:30:25"

Configuration Options

Default Settings

The tool uses the following default configuration:

const defaultConfig = {
  mode: 'visible',
  format: 'png',
  quality: 90,
  includeCursor: false,
  maxHistorySize: 50,
};

Supported Formats

FormatMIME TypeDescription
PNGimage/pngLossless compression, supports transparency
JPEGimage/jpegLossy compression, smaller file sizes
WebPimage/webpModern format with excellent compression

Capture Modes

ModeDescription
fullscreenCaptures the entire screen
visibleCaptures only the visible area of the page

Error Handling

Common Errors

CaptureError: Screenshot capture failed

try {
  const result = await captureScreenshot({ mode: 'fullscreen' });
} catch (error) {
  if (error.name === 'CaptureError') {
    console.error('Failed to capture screenshot:', error.message);
  }
}

FormatError: Unsupported image format

try {
  const result = await captureScreenshot({ format: 'invalid' });
} catch (error) {
  if (error.name === 'FormatError') {
    console.error('Unsupported format:', error.message);
  }
}

StorageError: Local storage operation failed

try {
  addToHistory(screenshotData);
} catch (error) {
  if (error.name === 'StorageError') {
    console.error('Storage operation failed:', error.message);
  }
}

Browser Compatibility

Supported Browsers

BrowserMinimum VersionNotes
Chrome60+Full support
Firefox55+Full support
Safari12+Full support
Edge79+Full support

Feature Support

FeatureChromeFirefoxSafariEdge
Screenshot Capture✅✅✅✅
Clipboard API✅✅✅✅
Local Storage✅✅✅✅
WebP Format✅✅✅✅

Performance Considerations

Memory Usage

  • Screenshots are stored in browser memory during processing
  • Large screenshots may consume significant memory
  • History is limited to prevent memory issues

Processing Time

  • Capture time depends on screen size and complexity
  • Full screen captures take longer than visible area captures
  • Format conversion adds processing overhead

Storage Limits

  • Browser local storage has size limits
  • History is automatically limited to 50 items
  • Older screenshots are removed when limit is reached

Integration Examples

Basic Integration

// Capture and download a screenshot
async function captureAndDownload() {
  try {
    const result = await captureScreenshot({
      mode: 'visible',
      format: 'png',
    });

    downloadScreenshot(result.dataUrl, 'my-screenshot.png');
  } catch (error) {
    console.error('Capture failed:', error);
  }
}

Advanced Integration

// Capture with custom settings and history management
async function advancedCapture() {
  try {
    const result = await captureScreenshot({
      mode: 'fullscreen',
      format: 'jpeg',
      quality: 80,
      includeCursor: true,
    });

    // Add to history
    const id = addToHistory({
      filename: `screenshot-${Date.now()}.jpg`,
      imageData: result.dataUrl,
      dimensions: `${result.dimensions.width}x${result.dimensions.height}`,
      size: result.size,
      format: result.format,
    });

    // Copy to clipboard
    await copyToClipboard(result.dataUrl);

    console.log(`Screenshot captured with ID: ${id}`);
  } catch (error) {
    console.error('Advanced capture failed:', error);
  }
}

Batch Processing

// Capture multiple screenshots with different settings
async function batchCapture() {
  const settings = [
    { mode: 'visible', format: 'png' },
    { mode: 'fullscreen', format: 'jpeg', quality: 70 },
    { mode: 'visible', format: 'webp' },
  ];

  const results = [];

  for (const setting of settings) {
    try {
      const result = await captureScreenshot(setting);
      results.push(result);
    } catch (error) {
      console.error(`Capture failed for ${setting.mode}:`, error);
    }
  }

  return results;
}

This API reference provides comprehensive information for integrating the Screenshot Tool into your applications. For additional support or feature requests, please refer to the project documentation or contact the development team.

Was this page helpful?