browserlane
Guides

Screenshots & PDFs

Capture the viewport, the full page, or an annotated map — and export the page to PDF.

browserlane captures the page two ways: as an image with bl screenshot, or as a document with bl pdf. Both can navigate first, so a capture is often a one-liner.

Screenshots

Capture the current page to a file with -o:

bl go https://example.com
bl screenshot -o page.png

Without -o, the file is named screenshot.png in the current directory. You can also navigate and capture in a single command — pass the URL first:

bl screenshot https://example.com -o page.png

Full page

By default a screenshot captures just the visible viewport. Add --full-page to capture the entire scrollable page, top to bottom:

bl screenshot -o full.png --full-page

Annotated screenshots

--annotate overlays numbered labels on the interactive elements — the same elements bl map would list. It's a quick visual companion to the map output when you want to see where @e1, @e2, … actually are on the page:

bl map
bl screenshot -o annotated.png --annotate

Annotate pairs with map

--annotate is most useful alongside bl map: the map gives you the refs as text, the annotated screenshot shows you where each one sits on the page. It's a fast way to confirm you're about to act on the right element.

PDFs

bl pdf saves the current page as a PDF. Like screenshot, it takes -o (and defaults to page.pdf):

bl go https://example.com
bl pdf -o page.pdf

Or navigate and export in one step:

bl pdf https://example.com -o invoice.pdf

A common pattern is to render a page exactly as you want it, then export — for example after logging in or applying a print stylesheet:

bl go https://app.example.com/report/42
bl wait load
bl pdf -o report.pdf

Capturing in CI or on a server

Every command runs a visible Chrome window by default. On a headless box, add --headless to hide it — the capture is identical either way:

bl screenshot https://example.com -o page.png --headless
bl pdf https://example.com -o page.pdf --headless

Control what's captured

A screenshot reflects the page's current state, so set that up first. A few controls worth knowing:

bl viewport 1280 720          # set the viewport size before capturing
bl media --color-scheme dark  # force dark mode
bl scroll into-view ".chart"  # bring an element into view first

See bl viewport and bl media for the full set of emulation options.

On this page