playwright/docs/src/screenshots.md

id	title
screenshots	Screenshots

Here is a quick way to capture a screenshot and save it into a file:

await page.screenshot({ path: 'screenshot.png' });

await page.screenshot(path="screenshot.png")

page.screenshot(path="screenshot.png")

Screenshots API accepts many parameters for image format, clip area, quality, etc. Make sure to check them out.

Full page screenshots

Full page screenshot is a screenshot of a full scrollable page, as if you had a very tall screen and the page could fit it entirely.

await page.screenshot({ path: 'screenshot.png', fullPage: true });

page.screenshot(new Page.ScreenshotOptions()
  .setPath(Paths.get("screenshot.png"))
  .setFullPage(true));

await page.screenshot(path="screenshot.png", full_page=True)

page.screenshot(path="screenshot.png", full_page=True)

Capture into buffer

Rather than writing into a file, you can get a buffer with the image and post-process it or pass it to a third party pixel diff facility.

const buffer = await page.screenshot();
console.log(buffer.toString('base64'));

byte[] buffer = page.screenshot();
System.out.println(Base64.getEncoder().encode(buffer));

# Capture into Image
screenshot_bytes = await page.screenshot()
image = Image.open(io.BytesIO(screenshot_bytes))

screenshot_bytes = page.screenshot()
image = Image.open(io.BytesIO(screenshot_bytes))

var bytes = await page.ScreenshotAsync();

Element screenshot

Sometimes it is useful to take a screenshot of a single element.

const elementHandle = await page.$('.header');
await elementHandle.screenshot({ path: 'screenshot.png' });

ElementHandle elementHandle = page.querySelector(".header");
elementHandle.screenshot(new ElementHandle.ScreenshotOptions().setPath(Paths.get("screenshot.png")));

element_handle = await page.query_selector(".header")
await element_handle.screenshot(path="screenshot.png")

element_handle = page.query_selector(".header")
element_handle.screenshot(path="screenshot.png")

var elementHandle = await page.QuerySelectorAsync(".header")
await elementHandle.ScreenshotAsync(new ElementHandleScreenshotOptions { Path = "screenshot.png" });

API reference

• [method: Page.screenshot]
• [method: ElementHandle.screenshot]