Media Capture

Use the screenshot APIs when you want image output for docs, debugging, or regression evidence. This guide focuses on image capture only.

Capture APIs

• screenshot
• captureViewport
• captureElement
• captureRegion

Viewport screenshot

Use this for the visible browser area:

const image = await view.captureViewport({
  format: "png",
  encoding: "base64",
});

console.log("Viewport image bytes", String(image).length);

Element screenshot

Use this for a specific UI element:

const image = await view.captureElement("#checkout-panel", {
  format: "png",
  encoding: "base64",
});

Region screenshot

Use this for a section of the page when you know the bounds:

const image = await view.captureRegion(100, 200, 800, 480, {
  format: "png",
  encoding: "base64",
});

Full-page images

There is not a dedicated one-shot full-page screenshot API in the current capture layer. If you need a single full-page image, capture the viewport across scroll positions and stitch the images in your own post-processing step.

Notes

• Use quality, format, and clip to tune output size.
• Use dedicated output folders in examples so generated assets are easy to clean up.