Skip to main content
Agentastic includes a built-in web browser so you can preview your application, inspect UI components, and debug JavaScript without switching to an external app. The browser runs on WebKit (the same engine as Safari) and exposes a CLI called dev browser that AI agents can use to navigate pages, interact with elements, and verify their own changes — all from the terminal.

Opening a browser tab

Go to File > New Browser Tab. The tab opens to localhost:3000 by default (the http:// prefix is added automatically). You can navigate to any URL using the toolbar’s address bar.

Toolbar features

The browser toolbar provides standard navigation controls (back, forward, reload, address bar) plus four debugging tools:
  • Inspect element — inspect the DOM and CSS of any element on the page.
  • Console — view JavaScript output, warnings, and errors.
  • Screenshot — capture the current page to your clipboard.
  • Open in Safari — open the current URL in your default browser.

React Grab

React Grab is a feature designed for React developers. It lets you click on any rendered component to extract its source location, so you can tell an AI agent exactly which file and line to edit.
1

Enable React Grab

Click the cursor button in the browser toolbar.
2

Hover over a component

Move your cursor over the page. React components are highlighted as you hover.
3

Click to select

Click a component. Agentastic extracts the element markup, component name, source file, and line number.
The result looks like this:
Paste this directly into your agent prompt to point it at exactly the right place.
Combine React Grab with a screenshot for maximum context: take a screenshot of a broken UI, inspect the component, and send both to the agent with “fix this element.”

Console

Click the </> button in the toolbar to toggle the console panel. The console captures: Use the console for quick JavaScript debugging without opening an external browser’s DevTools.

Screenshot

1

Click the camera button

Click the camera icon in the toolbar.
2

Screenshot is copied to clipboard

The full-page screenshot is copied automatically.
3

Paste where needed

Paste the image into Agent Home, a terminal, or any other input that accepts images.
Screenshots are useful for sharing bug reproductions with AI agents, documenting UI states, and creating visual references for design feedback.

Open in Safari

Click the Safari button to open the current URL in your default browser. Use this when you need full DevTools, browser extensions, or compatibility testing in a different rendering engine.

Browser automation for agents

Agentastic exposes the built-in browser to AI agents via the dev browser CLI. An agent running in a terminal tab can navigate pages, inspect the DOM, fill forms, click elements, and read console output — programmatically and without human intervention.

How it works

When Agentastic opens a terminal, it injects two environment variables automatically: The dev browser CLI communicates with the app over this socket using JSON-RPC. Agents like Claude Code can call dev browser commands directly within their terminal sessions.

Quick start

Open a browser tab, then run commands from the terminal:

Element references (@eN)

When you run dev browser snapshot, the DOM tree is returned with @eN references assigned to each interactive element:
Use these refs in subsequent commands instead of CSS selectors:
Element references are stable within a snapshot session but reset when you take a new snapshot.

Command categories

For the complete command reference, see Browser CLI Reference.

Example: agent testing a login flow

An AI agent can verify a login page end-to-end without any manual steps:

Security

The socket only accepts connections from your user account, verified via peer UID. No other user on the system can access the browser automation API.

Limitations

The built-in browser:
  • Uses WebKit (Safari’s engine), not Chrome or Firefox.
  • Does not support browser extensions.
  • Provides simplified DevTools — the console panel only; no full element inspector.
  • May render pages differently from Chrome or Firefox.
For full cross-browser compatibility testing, use the Open in Safari button or test in multiple external browsers.