Browser Screenshot to Bug Report

Turn a flaky browser repro into a triage-ready GitHub issue — automatically.

This is one of FrootAI's cross-server composition recipes — a single solution play whose agent attaches Playwright + Markitdown + GitHub and runs them as one pipeline. Playwright can drive the browser but can't file an issue; GitHub can file an issue but can't see the rendered page; Markitdown turns the captured markup into a clean summary. No single MCP server does the job — the value is in the federation.

What you'll build

The agent's task, in one line:

Visit the failing page, capture a screenshot, DOM snapshot, and console errors, summarize what went wrong, and open a triage-ready GitHub issue.

It attaches playwright, markitdown, github via the play's mcp_scope, runs the loop end to end, and detaches when it's done.

Why compose instead of chain

Federating MCP servers behind one agent means the model decides which tool to call when — no brittle glue code wiring outputs to inputs. The attach list is declarative; the engine wires the servers before the first turn and tears them down after. You get the composition without owning the plumbing.

Run it

The recipe ships a runnable, offline harness plus the full mcp_scope.attached snippet, a cost breakdown (~$3.00 per 100 runs), and a security note for every credential. Read the full recipe:

- 📖 Cookbook recipe - ▶️ Open in Studio

The takeaway

The interesting MCP work isn't any single server — it's the federation. This recipe is one worked example of many in the FrootAI cookbook. Compose, don't chain.