{"slug": "show-hn-devsnoop", "title": "Show HN: DevSnoop", "summary": "DevSnoop, a new open-source tool, enables coding agents like Codex and Claude Code to inspect and interact with real Chrome tabs via a local HTTP server on port 9400, providing structured, token-efficient browser data. The tool, which supports commands such as page_summary, click, fill, get_network, get_logs, diff, and screenshot, aims to close the frontend feedback loop by letting agents verify UI changes before editing code. A measured comparison shows DevSnoop uses 15 calls with ~2.8k text and 2.5k image input and ~700 output tokens at ~$0.047, versus Chrome DevTools MCP's higher costs.", "body_md": "Local Chrome evidence for coding agents\n\n# Stop guessing what your agent sees in the browser\n\nDevSnoop lets Codex, Claude Code, and other coding agents inspect your real Chrome tab, click UI, read console and network failures, catch hard-to-read text and icons, and verify what changed before they edit the wrong file.\n\nAgent debugging cockpit\n\nA tiny product win before install\n\nPrompt\n\n\"Click checkout in my local app and tell me why nothing happens.\"\n\nAgent report\n\n\"The UI is clickable. Checkout is blocked by auth. Fix the API/session path before changing the CTA component. Also, the green status text measures 3.3 to 1.\"\n\nFrontend feedback loop\n\n## The missing loop is the browser\n\nCoding agents are useful when they can check their work. Frontend work breaks that loop because the important evidence is sitting in Chrome: the current DOM, the selected tab, the failed request, the console exception, and the state after a click.\n\nDevSnoop does not replace end-to-end tests or promise that the UI is correct. It gives the agent a local Chrome evidence loop so it can inspect, act, read failures, compare the page, and then decide what code to edit.\n\n[Read the loop recipe](/closing-the-frontend-loop-for-coding-agents)\n\nBefore the edit\n\n- 1\n`page_summary`\n\nfinds structure, text, controls, and selectors. - 2\n`click`\n\nor`fill`\n\nreproduces the real user action. - 3\n`get_network`\n\nand`get_logs`\n\nexplain browser failures. - 4\n`diff`\n\nchecks what changed after the action or hot reload. - 5\n`screenshot`\n\nis saved for visual state, layout, and review.\n\n## What your agent can do\n\n### Inspect\n\nSemantic page structure, computed styles, element details — condensed for minimal token usage.\n\n### Interact\n\nClick buttons, fill forms, scroll pages, hover elements. Your agent drives the browser like a user.\n\n### Debug\n\nConsole logs, network requests, redacted payloads, JS exceptions — captured automatically, filtered on demand.\n\n### Legibility QA\n\nCatch faint text, weak icon contrast, tiny labels, clipping, and gradient cases with selector, location, evidence, and fix guidance.\n\n### Control multiple Chrome profiles\n\nLabel each DevSnoop profile once, then let your agent list connections and choose the right browser context. Keep separate logins, sites, and test accounts open without mixing their tabs.\n\n## How it works\n\nAgent sends a JSON command via HTTP to the native host running on `port 9400`\n\n.\n\nNative host forwards the command to Chrome via Native Messaging. The extension executes it on the page.\n\nStructured, token-efficient results flow back the same path. No raw HTML — just what the agent needs.\n\n## One HTTP call. Structured results.\n\nAgents send JSON commands to `port 9400`\n\nand get back compact, token-efficient responses. No raw HTML. No DevTools protocol.\n\n```\ncurl -s -X POST http://127.0.0.1:9400/ \\\n  -H 'Content-Type: application/json' \\\n  -d '{\"command\":\"legibility_audit\",\"params\":{\"viewportOnly\":false},\"tabID\":123}'\n{\n  \"ok\": true,\n  \"result\": {\n    \"score\": 84,\n    \"summary\": { \"serious\": 2, \"minor\": 1 },\n    \"issues\": [\n      {\n        \"kind\": \"low_contrast\",\n        \"severity\": \"serious\",\n        \"element\": {\n          \"textContent\": \"popular\",\n          \"selector\": \"nav a:nth-child(3) span\",\n          \"documentRect\": { \"x\": 624, \"y\": 77, \"width\": 48, \"height\": 20 }\n        },\n        \"evidence\": { \"contrastRatio\": 3.61, \"requiredRatio\": 4.5 },\n        \"recommendation\": \"Increase contrast by changing the text color, background color, size, or weight.\"\n      }\n    ]\n  }\n}\n```\n\n## Structured browser data stays compact\n\nA fixed inspect-submit-debug-screenshot workflow shows how much browser context each path sends back to the agent. DevSnoop uses more small calls than Chrome DevTools MCP, but returns denser, task-shaped results with fewer tokens.\n\n[See commands](/docs)\n\n| Path | Basis | Calls | Input | Output | Cost |\n|---|---|---|---|---|---|\n| DevSnoop | measured | 15 | ~2.8k text + 2.5k image | ~700 | ~$0.047 |\n| Chrome DevTools MCP | measured | 7 | ~4.5k text + 2.5k image | ~1.1k | ~$0.068 |\n| Chrome DevTools CLI | measured | 12 | ~7.6k text + 2.5k image | ~900 | ~$0.078 |\n| Screenshot loop | estimated | 6 | ~14.9k image | ~1.2k | ~$0.111 |\n\nCosts use gpt-5.5 token pricing estimates. Browser state, page complexity, model choice, and retry behavior change real costs. Screenshot-loop row models six vision turns.\n\n## Compare browser agent paths\n\nDevSnoop is built for local Chrome control when coding agents need selectors, legibility checks, logs, diffs, screenshots, and UI actions without a hosted browser workflow.\n\n[One-time $29 license](/pricing)\n\n### Closing the frontend loop\n\nGive agents a repeatable browser loop: inspect, act, read failures, diff, then edit.\n\n### Capture fetch request bodies\n\nLet agents inspect redacted request and response bodies before editing frontend code.\n\n### Browse.dev alternative\n\nUse local Chrome, compact browser commands, and one-time pricing instead of hosted browser sessions.\n\n### Chrome DevTools MCP alternative\n\nGive agents page summaries, selectors, diffs, logs, network failures, and screenshots through one local HTTP API.\n\n## Works with any coding agent\n\nAny tool that can make HTTP requests can control the browser.", "url": "https://wpnews.pro/news/show-hn-devsnoop", "canonical_source": "https://devsnoop.com", "published_at": "2026-08-12 08:06:08+00:00", "updated_at": "2026-08-12 08:11:07.854188+00:00", "lang": "en", "topics": ["developer-tools", "ai-agents", "ai-tools"], "entities": ["DevSnoop", "Codex", "Claude Code", "Chrome"], "alternates": {"html": "https://wpnews.pro/news/show-hn-devsnoop", "markdown": "https://wpnews.pro/news/show-hn-devsnoop.md", "text": "https://wpnews.pro/news/show-hn-devsnoop.txt", "jsonld": "https://wpnews.pro/news/show-hn-devsnoop.jsonld"}}