Screenshot Page

Take a PNG screenshot of the active tab: what is on screen, the whole page, or one element.

What it does

Pick a Mode:

• Viewport: the part of the page currently visible in the tab.
• Full Page: the entire page, from top to bottom.
• Element: just the element in DOM Selector, even if it is taller than the screen.

The screenshot is made from what the browser actually shows, so images, web fonts, charts, canvases and video frames look exactly as they do on screen. For Full Page and Element, the node scrolls the page, captures it piece by piece and stitches the pieces into one image. Afterwards it puts the page back where you had scrolled it, even if the capture fails.

The image is returned both as a data URL and as a file attached to the item, so nodes that accept files (image editing, uploads, AI vision nodes) can use it directly.

When to use it

• Keep a visual record of a page at a moment in time: an order confirmation, a dashboard, a price.
• Send a picture of a chart or an error message to a chat channel or a ticket.
• Give a page or a widget to an image AI node to describe or classify it.
• To read the page’s content as text instead, use Get All Text.

Inputs and settings

设置项	类型	作用
Mode 必填（必填）	Choice	Choose what to capture. Options: Visible area, Full page, Element. 默认值：Visible area
DOM Selector	Page element	The selector of the DOM element to interact with.

DOM Selector is used only in Element mode. Click the crosshair button in the field and click the element on the page, or type a CSS selector such as #chart.

Outputs

• Output

Each output item has these fields:

Field	类型	What it holds
mode	Choice
selector	Text
dataUrl	Text	The image as a data: URL
found	True/false
boundingBox	Object
$binary	Key-value pairs

Shape of an output item

{
  "mode": "…",
  "selector": "…",
  "dataUrl": "…",
  "found": true,
  "boundingBox": {},
  "$binary": {}
}

• dataUrl: the image as data:image/png;base64,…. The same image is attached as a file in $binary.data.
• found: false in Element mode when the selector matches nothing. dataUrl is then empty and no file is attached.
• boundingBox: the captured area (top, left, width, height, in page pixels). In Element mode it is the element’s position on screen before the capture.
• mode and, in Element mode, selector: what was captured.

Dependencies and credentials

None. This node needs no connection and has no slots for other nodes.

No credential is needed. The first time a screenshot runs, AWFlow asks for your permission to capture images of the web pages you open. Choose Allow. The browser usually does not ask again, because this is covered by the site access you accepted when you installed the extension. Once allowed, screenshots work in every workflow, including scheduled and triggered runs.

Example workflow

1. A Schedule trigger runs every morning.
2. Tab Control, Operation = Open, opens your dashboard with Wait For Load on.
3. Screenshot Page with Mode = Element and DOM Selector set to the chart.
4. Slack, File → Upload, posts the image to #daily-metrics.

Common issues

• “Screenshot Page needs permission to capture web pages…” You have not allowed screenshots yet. You can only allow it while the AWFlow app is open, so run the workflow once from the app or the side panel and choose Allow. A run started by a trigger while the app is closed fails with this message until you do.
• “Screenshot … is too large (maximum 64 tiles or 100000000 pixels). Use Element mode to capture a smaller target.” Very long pages exceed the limit. Capture a specific element instead.
• found is false and there is no image. DOM Selector matched nothing. Check it with Ping, or wait for the element with Wait For Element first.
• A sticky header appears several times in a Full Page image. Each piece shows what is on screen while that part is scrolled into view, so fixed headers and banners repeat. Capture a specific element to avoid it.
• Images or animations look different from one part to the next. Full Page and Element captures take several frames over a few seconds. Let the page finish loading, and scroll it once so late-loading images appear, before running the node.

Related nodes

• Caption Image: describe the screenshot on your device.
• Edit Image: crop or resize it.
• Download as file: save it to your computer.
• Get Page Metadata: the page’s title and address to go with it.