Capturing Giant Power Automate Flows as One Image

Power Automate flows get large fast. Once a flow spills past the viewport, taking screenshots becomes a painful sequence of manual scrolling, partial captures, and trying to stitch everything together by hand.

PA Flow Capture solves that with a Firefox extension that captures the entire flow canvas and exports a single stitched PNG.

How capture works

The extension detects the flow designer canvas, then lets you place two anchors with Ctrl + click to define the exact capture bounds. From there it moves the viewport tile-by-tile, pauses for settle timing, and captures each frame.

Stitching without ugly seams

Raw captures almost always produce visible join lines because of anti-aliasing and tiny movement differences between frames. The background stitcher runs on OffscreenCanvas and uses horizontal seam matching (grayscale SAD) to line up edges and reduce visible artifacts.

// rough flow
for (const tile of tiles) {
  await scrollTo(tile);
  await settle();
  const shot = await captureVisibleTab();
  frames.push(cropToViewport(shot));
}

const finalImage = stitchWithSeamMatching(frames);

Why Firefox + MV3

This is a Manifest V3 extension with a popup UI, content script for in-page capture orchestration, and background worker for image processing. No build system needed, so iteration is fast when tuning capture timing.

Useful knobs

The biggest win was reliability, not speed: getting deterministic capture boundaries and predictable seams means the output is consistently readable even on very large flows.

Repo

Source code is available on GitHub with local run instructions through about:debugging in Firefox.


← Back to all posts  ·  View on GitHub ↗