For developers working with coding agents

Let your coding agent look at the preview deployment it just made

Give a coding agent a real browser so it can look at the preview of its own change, errors included, before it reports done.

Get your free API key Try the playground

The problem

A coding agent edits a component, runs the tests and reports success. The tests never rendered the page, so nobody, human or agent, saw that the new header now covers the navigation on every route.

How domscout handles it

With domscout's MCP server installed, Claude Code, Cursor, VS Code or any other MCP client can call domscout_capture_screenshot on the preview URL its change deployed to and look at the result, or domscout_extract_markdown to read it. Over the API, debugOverlay draws the page's console errors, failed requests and oversized assets onto the screenshot, so one image tells the agent both what the page looks like and what went wrong while it loaded. The page has to be reachable from the internet, so point the agent at a preview deployment, not at localhost.

Where it shows up

An agent instruction to screenshot the preview before reporting a UI change as done.
A pull-request comment with the preview's screenshot and its errors.
A quick visual check during a refactor that touches shared styles.

The request

POST /screenshot. Available on every plan, including the free Hobby plan, at 1 credit an image. A tool call through MCP is billed exactly like the same HTTP request.

cURL

curl -X POST https://api.domscout.io/screenshot \
  -H "x-api-key: YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "url": "https://feature-header.preview.example.com/",
    "debugOverlay": true,
    "format": "webp",
    "responseType": "binary"
  }' \
  -o preview.webp

Node.js

import { writeFile } from "node:fs/promises";

const response = await fetch("https://api.domscout.io/screenshot", {
  method: "POST",
  headers: { "Content-Type": "application/json", "x-api-key": "YOUR_API_KEY" },
  body: JSON.stringify({
    url: "https://feature-header.preview.example.com/",
    debugOverlay: true,
    format: "webp",
    responseType: "binary"
  }),
});
await writeFile("preview.webp", Buffer.from(await response.arrayBuffer()));

Python

import requests

response = requests.post(
    "https://api.domscout.io/screenshot",
    headers={"x-api-key": "YOUR_API_KEY"},
    json={
        "url": "https://feature-header.preview.example.com/",
        "debugOverlay": True,
        "format": "webp",
        "responseType": "binary"
    },
)
with open("preview.webp", "wb") as f:
    f.write(response.content)

package main

import (
	"bytes"
	"encoding/json"
	"io"
	"net/http"
	"os"
)

func main() {
	body, _ := json.Marshal(map[string]any{
		"url": "https://feature-header.preview.example.com/",
		"debugOverlay": true,
		"format": "webp",
		"responseType": "binary",
	})
	req, _ := http.NewRequest("POST", "https://api.domscout.io/screenshot", bytes.NewReader(body))
	req.Header.Set("Content-Type", "application/json")
	req.Header.Set("x-api-key", "YOUR_API_KEY")

	res, err := http.DefaultClient.Do(req)
	if err != nil {
		panic(err)
	}
	defer res.Body.Close()

	out, _ := os.Create("preview.webp")
	defer out.Close()
	io.Copy(out, res.Body)
}

PHP

<?php
$ch = curl_init('https://api.domscout.io/screenshot');
curl_setopt_array($ch, [
    CURLOPT_POST => true,
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_HTTPHEADER => ['Content-Type: application/json', 'x-api-key: YOUR_API_KEY'],
    CURLOPT_POSTFIELDS => json_encode([
        'url' => 'https://feature-header.preview.example.com/',
        'debugOverlay' => true,
        'format' => 'webp',
        'responseType' => 'binary'
    ]),
]);
$response = curl_exec($ch);
if ($response === false) {
    throw new RuntimeException(curl_error($ch));
}
file_put_contents('preview.webp', $response);

Ruby

require "json"
require "net/http"

response = Net::HTTP.post(
  URI("https://api.domscout.io/screenshot"),
  {
    url: "https://feature-header.preview.example.com/",
    debugOverlay: true,
    format: "webp",
    responseType: "binary"
  }.to_json,
  "Content-Type" => "application/json",
  "x-api-key" => "YOUR_API_KEY"
)
File.binwrite("preview.webp", response.body)

Java

import java.net.URI;
import java.net.http.HttpClient;
import java.net.http.HttpRequest;
import java.net.http.HttpResponse;
import java.nio.file.Path;

public class Capture {
    public static void main(String[] args) throws Exception {
        String body = """
            {
                "url": "https://feature-header.preview.example.com/",
                "debugOverlay": true,
                "format": "webp",
                "responseType": "binary"
            }
            """;
        HttpRequest request = HttpRequest.newBuilder(URI.create("https://api.domscout.io/screenshot"))
            .header("Content-Type", "application/json")
            .header("x-api-key", "YOUR_API_KEY")
            .POST(HttpRequest.BodyPublishers.ofString(body))
            .build();
        HttpResponse<Path> response = HttpClient.newHttpClient().send(request, HttpResponse.BodyHandlers.ofFile(Path.of("preview.webp")));
        System.out.println("Saved " + response.body());
    }
}

using System.Net.Http.Json;

using var client = new HttpClient();
client.DefaultRequestHeaders.Add("x-api-key", "YOUR_API_KEY");

var response = await client.PostAsJsonAsync("https://api.domscout.io/screenshot", new {
    url = "https://feature-header.preview.example.com/",
    debugOverlay = true,
    format = "webp",
    responseType = "binary"
});
await File.WriteAllBytesAsync("preview.webp", await response.Content.ReadAsByteArrayAsync());

Go further

MCP server

Guide: give an MCP client a browser

JavaScript error checks

More in AI and agents: Web access for AI agents · llms.txt from your docs · Screenshots for vision models · Rendering generated HTML · Newsletter curation · FAQ drafts from documentation · All use cases

Give your product a browser.

Get clean web content and visual proof into your workflow in minutes.

Get your free API key Read the docs