cursor

2 posts with the tag “cursor”

Gasoline MCP vs Cursor MCP Extension: Which Should Cursor Users Choose?

Jan 31, 2025

Brenn Hill

If you use Cursor, you now have two MCP options for browser debugging: Cursor MCP Extension and Gasoline MCP. Both capture browser telemetry and surface it to your AI assistant through the Model Context Protocol. But they differ in scope, features, and portability.

Cursor MCP Extension is built exclusively for Cursor. Gasoline MCP works with Cursor and every other MCP-compatible tool — Claude Code, Windsurf, Claude Desktop, Zed, and whatever ships next.

Here’s a practical comparison to help you decide.

Feature Comparison

Feature	Gasoline MCP	Cursor MCP Extension
Console log capture	Yes	Yes
Network error capture	Yes	Yes
Network body capture	Yes	No
WebSocket monitoring	Yes	No
DOM queries (CSS selectors)	Yes	No
Accessibility auditing	Yes	No
Test generation (Playwright)	Yes	No
Multi-editor support	Yes	No (Cursor only)

Gasoline MCP covers every capability Cursor MCP Extension offers, then adds network body capture, WebSocket monitoring, DOM queries, accessibility auditing, and Playwright test generation on top.

Architecture

Both tools use a Chrome extension paired with a local server. The difference is in the runtime:

Gasoline MCP: Chrome extension + single Go binary. Zero dependencies. No Node.js required. The binary you download is the binary you run — no node_modules/, no lock files, no supply chain surface area.
Cursor MCP Extension: Chrome extension + Node.js MCP server. Requires a Node.js runtime and npm packages.

If dependency footprint matters to your team — for security audits, enterprise policy, or simply reducing moving parts — Gasoline MCP’s zero-dependency design is a meaningful advantage.

Why Portability Matters

The AI editor landscape is evolving fast. A year ago, most developers hadn’t heard of MCP. Today, it’s supported by Claude Code, Cursor, Windsurf, Claude Desktop, Zed, and more.

Cursor MCP Extension locks your browser debugging setup to a single editor. If you switch to another tool — or even want to try one — you need a different solution.

Gasoline MCP is editor-agnostic. It works with any tool that speaks MCP. Your browser debugging configuration moves with you, regardless of which assistant you’re using today or which one you try tomorrow.

Features Cursor MCP Extension Lacks

The feature gap is significant if you’re debugging anything beyond basic console errors:

WebSocket monitoring. If your app uses WebSockets — chat, real-time dashboards, collaborative editing, live data feeds — Cursor MCP Extension can’t see that traffic. Gasoline MCP captures WebSocket frames with adaptive sampling to keep overhead negligible.

Network body capture. Cursor MCP Extension reports network errors, but not response bodies. When your AI assistant is debugging a failed API call, it needs to see what the server actually returned. Gasoline MCP captures request and response bodies with configurable filtering.

DOM queries. Gasoline MCP lets your AI assistant query the live DOM using CSS selectors. This is essential for verifying that UI changes rendered correctly or diagnosing layout issues.

Test generation. Gasoline MCP can generate Playwright tests from captured browser sessions. You browse your app, and your AI assistant turns that session into reproducible test code. Cursor MCP Extension has no equivalent.

When Cursor MCP Extension Is Fine

Cursor MCP Extension is a reasonable choice if all of the following are true:

You only use Cursor and have no plans to try other editors
You only need basic console log and network error capture
You don’t work with WebSocket-based applications
You don’t need to inspect network response bodies
You want the absolute simplest setup with minimal configuration

For straightforward console-error debugging in a Cursor-only workflow, it gets the job done.

When Gasoline MCP Is Better

Gasoline MCP is the stronger choice if any of the following apply:

You want full-spectrum browser debugging (console, network, WebSocket, DOM)
You use multiple AI editors or plan to try new ones
You need network body capture for API debugging
You work with real-time applications that use WebSockets
You want to generate Playwright tests from real browser sessions
You prefer zero dependencies and a minimal supply chain footprint

Should Cursor users use Gasoline MCP or Cursor MCP Extension?

If you’re a Cursor user deciding between the two, the question is whether you need more than basic console and network error capture. If you do — and most non-trivial debugging sessions do — Gasoline MCP gives you substantially more to work with. It also means your setup won’t break if you try a different editor next month.

Does Gasoline MCP work with Cursor?

Yes. Gasoline MCP works with Cursor through standard MCP configuration. Setup takes a few minutes and requires no special integration. See the Cursor setup guide for step-by-step instructions.

Get Started

npx gasoline-mcp

One command. No runtime dependencies. Works with Cursor and every other MCP client.

Cursor setup guide | Full getting started guide

How to Give Cursor Access to Browser Console Logs

Jan 25, 2025

Brenn Hill

Cursor is a powerful AI code editor, but it has a blind spot: your browser. When your app throws an error at runtime, Cursor has no idea. You end up copying console output, screenshotting network tabs, and pasting fragments into chat — losing context every time.

Gasoline MCP is an open-source browser extension + MCP server that streams real-time browser telemetry to AI coding assistants. It connects Cursor directly to your browser so it can read console logs, network failures, and DOM state without you lifting a finger.

The Problem: Cursor Can’t See Your Browser

When something breaks in the browser, your workflow probably looks like this:

Notice a blank page or broken UI
Open Chrome DevTools
Read through the console errors
Copy the relevant ones
Paste them into Cursor and explain what happened

By the time Cursor sees the error, you’ve already done the hard part — finding it. And you’ve stripped away surrounding context: the network request that failed before the error, the sequence of console warnings that preceded it, the state of the DOM.

Cursor needs raw, continuous access to what the browser is doing.

Why Existing Approaches Fall Short

You could keep a DevTools window open and manually relay information to Cursor. But manual copy-paste has real costs:

Lost context. You copy one error but miss the failed API call that caused it.
Stale data. By the time you paste, the browser state has changed.
Friction. Every round trip between browser and editor breaks your flow.

Cursor supports MCP (Model Context Protocol) natively, which means any tool that speaks MCP can feed data directly into Cursor’s context. Gasoline uses this to bridge the gap.

What Cursor Can See Through Gasoline

Once connected, Cursor can query your browser for live telemetry:

Data Type	What Cursor Sees
Console logs	All `console.log`, `console.warn`, `console.error` output
JavaScript errors	Uncaught exceptions with full stack traces
Network requests	URLs, status codes, timing, headers
Network bodies	Request and response payloads (opt-in)
WebSocket messages	Real-time WS frame data
DOM state	Query elements, read attributes, check visibility

This is not a snapshot. Gasoline captures events continuously, so Cursor can ask “what happened in the browser?” at any point and get the full picture.

Setup: Four Steps

1. Start the Gasoline server

npx gasoline-mcp@latest

This downloads a single Go binary (no Node.js runtime, no node_modules/). It starts a local MCP server on your machine.

2. Install the Chrome extension

Install the Gasoline extension from the Chrome Web Store. It connects to the local server automatically.

3. Add the MCP server to Cursor

Open Cursor Settings, navigate to MCP, and add a new server with this configuration:

{
  "mcpServers": {
    "gasoline": {
      "command": "npx",
      "args": ["-y", "gasoline-mcp@latest"]
    }
  }
}

4. Ask Cursor to check the browser

In Cursor’s chat or agent mode, just ask:

“Check the browser for errors”

Cursor will call Gasoline’s MCP tools, read the captured telemetry, and respond with what it finds — and often fix the issue in the same turn.

Real Workflow: React Dashboard Blank Screen

Without Gasoline (5 steps):

See blank screen in browser
Open DevTools, find TypeError: Cannot read properties of undefined (reading 'map') in console
Switch to Network tab, notice the /api/dashboard request returned a 500
Copy both the error and the failed request details
Paste into Cursor, explain the situation, wait for a fix

With Gasoline (1 step):

Ask Cursor: “The dashboard page is blank. Check the browser and fix it.”

Cursor reads the console error and the failed network request simultaneously through Gasoline, identifies that the API returned a 500 causing an undefined .map() call, and adds a null check or error boundary — all in one turn.

How do I connect Cursor to my browser?

Install the Gasoline Chrome extension and add the MCP server config to Cursor’s settings. Gasoline handles the connection between browser and editor over localhost. No accounts, no cloud services, no API keys.

Is Gasoline MCP secure?

Gasoline runs entirely on your machine. The server binds to 127.0.0.1 only and rejects non-localhost connections at the TCP level. It never makes outbound network calls. Sensitive headers (Authorization, Cookie) are stripped from captured network data by default. Request and response body capture is opt-in.

Get Started

npx gasoline-mcp@latest

One command to give Cursor full visibility into your browser. For the complete Cursor integration guide, see the Cursor + Gasoline setup docs.