# Blowback (Frontend Development)
> Integrates with frontend development environments to provide real-time feedback and debugging capabilities through browser automation, capturing console logs, monitoring HMR events, and enabling DOM interaction without leaving the conversation interface.
Canonical: https://www.mcpfolio.com/servers/blowback-frontend-development
Last updated: 2026-10-28
## Catalog record

- Publisher: esnark
- Categories: development, web-scraping

## Repository

https://github.com/esnark/blowback

## Transports

stdio

## Authentication

No credentials were configured; the tested read-only tool “get-hmr-events” succeeded in an isolated environment. Other tools may have additional requirements.

## Tools

- **how-to-use**: Description of how to use the server
- **start-browser**: Creates a new browser context with an auto-generated unique ID
- **list-browsers**: Lists all active browser instances
- **close-browser**: Closes a specific browser instance
- **get-context-info**: Gets detailed information about a specific browser instance
- **get-context-stats**: Gets usage statistics for browsers
- **get-hmr-events**: Retrieves recent HMR events
- **capture-screenshot**: Captures a screenshot of the current page or a specific element.
Stores the screenshot in the MCP resource system and returns a resource URI.
If ENABLE_BASE64 environment variable is set to 'true', also includes base64 encoded image in the response.
- **get-element-properties**: Retrieves properties and state information of a specific element
- **get-element-styles**: Retrieves style information of a specific element
- **get-element-dimensions**: Retrieves dimension and position information of a specific element
- **monitor-network**: Monitors network requests in the browser for a specified duration
- **get-element-html**: Retrieves the HTML content of a specific element and its children with optional depth control
- **get-console-logs**: Retrieves console logs from the development server
- **execute-browser-commands**: Executes a sequence of predefined browser commands safely. Available commands:

- click: Clicks on an element matching the selector or at specified coordinates
- type: Types text into an input element
- wait: Waits for an element, a specified time period, or a condition
- navigate: Navigates to a specified URL
- select: Selects an option in a dropdown
- check: Checks or unchecks a checkbox
- hover: Hovers over an element
- focus: Focuses an element
- blur: Removes focus from an element
- keypress: Simulates pressing a keyboard key
- scroll: Scrolls the page or an element
- getAttribute: Gets an attribute value from an element
- getProperty: Gets a property value from an element
- drag: Performs a drag operation from one position to another
- refresh: Refreshes the current page

Note on coordinates: For all mouse-related commands (click, drag, etc.), coordinates are relative to the browser viewport
where (0,0) is the top-left corner. X increases to the right, Y increases downward.

Exam
- **browser-evaluate**: Evaluates JavaScript code directly in the browser context and returns the result.
Supports expressions, function strings, and complex code with automatic execution handling.
Can target the entire page or work with element handles for precise DOM manipulation.

Examples:
- Simple expression: "document.title"
- Arrow function: "() => document.querySelectorAll('a').length"
- Regular function: "function() { return document.body.children.length; }"
- Function with arguments: "(tag) => document.getElementsByTagName(tag).length"
- Complex code: "() => { const divs = document.querySelectorAll('div'); return { count: divs.length, hasClass: divs[0]?.className }; }"
- Async function: "async () => { const res = await fetch('/api'); return res.json(); }"

## Sources

- [MCP.Directory public profile](https://mcp.directory/servers/blowback-frontend-development)
- [Linked publisher repository](https://github.com/esnark/blowback)
- [npm registry metadata](https://registry.npmjs.org/blowback-context)

## Setup

Use the interactive setup panel on [the detail page](https://www.mcpfolio.com/servers/blowback-frontend-development) to view instructions for each supported client.