# DevSnoop

DevSnoop stops coding agents from guessing what they see in Chrome. It gives agents browser control through a Chrome extension and local native host, so they can inspect pages, interact with UI, capture screenshots, read console/network errors, run heuristic legibility audits for hard-to-read text and icons, and verify changes using a compact HTTP JSON API.

## Core Use Cases

### Page Inspection

- Summarize semantic page structure with stable selectors
- Inspect individual elements with HTML subtree and computed styles
- Find elements by selector or text
- Detect frontend frameworks, libraries, CMSs, analytics, basic accessibility issues, and hard-to-read text or icons

### Page Interaction

- Click elements by selector, text, or coordinates
- Fill form fields by selector or matched text
- Scroll and hover
- Open tabs, list tabs, and navigate existing tabs

### Debugging and Verification

- Capture screenshots to local files
- Read console logs, JavaScript exceptions, and network activity
- Compare lightweight DOM/style snapshots after code or UI changes
- Help coding agents verify frontend work without raw browser protocol output
- Close the frontend loop before editing: page summary, user action, network/log evidence, DOM diff, and screenshot only when visual state matters

## How It Works

1. Install the DevSnoop Chrome extension.
2. Install the DevSnoop native host binary.
3. Configure the coding agent with DevSnoop's SKILL.md.
4. The agent sends HTTP requests to `http://127.0.0.1:9400/`.
5. The native host forwards commands to Chrome via Native Messaging.
6. The extension runs commands in the browser and returns structured JSON.

## API

All commands use:

`POST http://127.0.0.1:9400/`

With JSON:

`{"command":"<command>","params":{...},"tabID":<optional>}`

### Commands

- `list_tabs`: get open tabs with IDs, URLs, titles, and active state
- `open_tab`: open a new tab and optionally navigate to a URL
- `navigate`: navigate an existing tab
- `close_tab`: close an existing tab by ID, or the active tab if tabID is omitted
- `page_summary`: return semantic DOM structure and interactive elements
- `inspect_element`: return one element's subtree and computed styles
- `find`: find elements by CSS selector or text content
- `tech_stack`: detect frameworks, libraries, analytics, CMSs, and tools
- `accessibility_audit`: run basic accessibility checks
- `legibility_audit`: run a heuristic visual QA pass for hard-to-read text and icons, including weak contrast, tiny text, clipping, low-contrast icons, and text over images or gradients. It returns verified selector/location/evidence/fix guidance, includes class/HTML snippet evidence for icons, and is not accessibility certification.
- `screenshot`: capture a tab or element screenshot to a local file
- `click`: click an element by selector, text, or coordinates
- `fill`: fill a form input or textarea
- `scroll`: scroll the page or an element
- `hover`: hover an element
- `get_logs`: retrieve console logs and JavaScript errors
- `get_network`: retrieve network requests and responses, with opt-in redacted request/response bodies
- `diff`: compare current page state against the previous snapshot
- `get_storage`: inspect browser storage values for the page, redacting sensitive-looking values by default
- `ping`: verify host, extension, license, and 24h preview state

Recommended agent flow:

1. Call `ping` before other commands.
2. If `license.activated` is `true`, continue normally.
3. If `license.activated` is `false` and `preview.active` is `true`, continue normally until `preview.expiresAt`; the 24h preview allows all commands.
4. If `license.activated` is `false` and `preview.reason` is `not_started`, ask the user to open the DevSnoop extension popup and click Start preview.
5. If `license.activated` is `false` and `preview.reason` is `expired`, ask the user to buy or activate a license.

## Installation

Chrome extension:

`https://chromewebstore.google.com/detail/devsnoop/kkhkcpgpklnofjgnflkciekppiokdilp?utm_source=devsnoop.com&utm_medium=llms_txt&utm_campaign=cws_install&utm_content=install_docs`

Native host:

`curl -fsSL https://devsnoop.com/install.sh | bash`

Downloads:

- `https://devsnoop.com/downloads/latest/devsnoop-host-darwin-arm64`
- `https://devsnoop.com/downloads/latest/devsnoop-host-darwin-x64`
- `https://devsnoop.com/downloads/latest/devsnoop-host-linux-x64`
- `https://devsnoop.com/downloads/latest/devsnoop-host-linux-arm64`
- `https://devsnoop.com/downloads/latest/SKILL.md`

## Pricing

DevSnoop is a one-time purchase. It has no subscription, request metering, usage limit, or seat limit. Purchase includes 1 year of updates.

## Privacy

DevSnoop runs locally. The Chrome extension communicates with the native host on the user's machine. Page data is not sent to DevSnoop servers.

License verification uses `https://backend.devsnoop.com/verify`.

## Public Pages

- `https://devsnoop.com/`
- `https://devsnoop.com/install`
- `https://devsnoop.com/demo`
- `https://devsnoop.com/docs`
- `https://devsnoop.com/pricing`
- `https://devsnoop.com/browse-dev-alternative`
- `https://devsnoop.com/chrome-devtools-mcp-alternative`
- `https://devsnoop.com/localhost-is-not-a-security-boundary`
- `https://devsnoop.com/the-difference-between-debugging-the-request-and-debugging-the-feature`
- `https://devsnoop.com/capture-fetch-request-body`
- `https://devsnoop.com/closing-the-frontend-loop-for-coding-agents`
- `https://devsnoop.com/do-har-files-contain-sensitive-information`
- `https://devsnoop.com/tools/har-analyzer`
- `https://devsnoop.com/tools/xpath-tester`
- `https://devsnoop.com/faq`
- `https://devsnoop.com/privacy`

## About

DevSnoop is built by Hwee-Boon Yar, a solo indie developer who has been writing and delivering software for 30 years.

## Contact

- Email: hboon@devsnoop.com
- Site: https://hboon.com/
- X/Twitter: https://x.com/hboon
- Bluesky: https://bsky.app/profile/hboon.com