The MCP ecosystem is moving beyond databases and APIs and into something more visual and hands-on: giving AI agents direct access to a real browser. That is where Glance comes in. Published on GitHub by DebugBase, Glance is an MCP server built for Claude Code that lets the model open pages, click buttons, fill in forms, take screenshots, inspect the accessibility tree, monitor console errors, watch network requests, and run full browser test scenarios — all from the terminal.
The concept is easy to understand and genuinely useful. Instead of asking Claude to reason blindly about what a web interface might look like, Glance gives it a real browser session to inspect and control. The repository’s own example is straightforward: ask Claude to test the login flow on localhost:3000, and the agent can open the page, type into fields, submit the form, capture screenshots, verify the redirect, and check whether any browser warnings or errors appear in the console.
That makes Glance especially relevant for developers, QA teams, product engineers, and anyone who wants to validate a web app without constantly jumping between the browser and the terminal.
At the time of writing, the DebugBase/glance repository shows 123 stars, 13 forks, and 18 commits on GitHub. Those numbers suggest an early-stage project, but one that is already clearly packaged and focused around a strong developer use case. The repository also includes direct Claude Code integration, a dedicated agent called e2e-tester, and a quick-test skill called /glance-test.
What makes Glance stand out is that it does not stop at simple navigation. According to its README, it exposes 30 MCP tools covering browser control, test automation, session recording, and visual regression testing. In practice, that means it can handle both quick manual-style checks and more structured, repeatable test flows.
What Glance can do
| Area | What it enables |
|---|---|
| Navigation | Open URLs, go back and forward, manage tabs |
| Interaction | Click, type, hover, drag and drop, select options, press keys |
| Inspection | Inline screenshots, accessibility snapshots, console logs, network activity |
| Testing | Run multi-step scenarios, assertions, form filling, auth flow testing |
| Session handling | Record browser sessions and save them |
| Visual QA | Create baselines and compare screenshots pixel by pixel |
The repository groups these tools into 19 browser control tools, 7 testing tools, and 4 session/visual tools.
Installation and setup
Glance is intentionally simple to start with. The main install method is:
npm install -g glance-mcp
Or, if you want to add it directly to Claude Code:
claude mcp add glance -- npx glance-mcp
After that, the repository recommends adding it to your .mcp.json configuration. A minimal example looks like this:
{
"mcpServers": {
"glance": {
"command": "npx",
"args": ["glance-mcp"],
"env": {
"BROWSER_HEADLESS": "false"
}
}
}
}
This tells Claude Code how to launch Glance, and it also allows you to choose whether the browser runs in headless mode or visibly on screen.
Once configured, you can immediately start asking Claude things like:
- “Open localhost:3000 and take a screenshot”
- “Test the signup flow with an invalid email”
- “Check whether the pricing page shows all three tiers”
- “Run a visual regression test on the dashboard”
Main Glance tools
Browser control
| Tool | Purpose |
|---|---|
browser_navigate | Navigate to a URL |
browser_click | Click an element by CSS selector or text |
browser_type | Type into an input field |
browser_hover | Hover over an element |
browser_drag | Drag and drop between elements |
browser_select_option | Select a dropdown option |
browser_press_key | Press a keyboard key |
browser_scroll | Scroll the page or to an element |
browser_screenshot | Capture a screenshot and return it inline to Claude |
browser_snapshot | Get the accessibility tree as text |
browser_evaluate | Execute JavaScript on the page |
browser_console_messages | Read console logs and errors |
browser_network_requests | Monitor network activity |
browser_go_back / browser_go_forward | Move through browser history |
browser_tab_new, browser_tab_list, browser_tab_select | Manage tabs |
browser_close | Close the browser |
Testing and assertions
| Tool | Purpose |
|---|---|
test_scenario_run | Run a multi-step test scenario |
test_scenario_status | Check scenario execution status |
test_assert | Run a single assertion |
test_fill_form | Auto-fill a form |
test_auth_flow | Test a login or signup flow |
test_watch_events | Watch DOM or network events |
test_stop_watch | Stop event watching |
Session recording and visual regression
| Tool | Purpose |
|---|---|
session_start | Start recording a browser session |
session_end | End and save the session |
session_list | List recorded sessions |
visual_baseline | Save a visual baseline |
visual_compare | Compare a page against a saved baseline |
How it works in practice
The most obvious use case is local development. Instead of opening the browser yourself, clicking around, and then trying to explain what happened to Claude, you can simply ask it to test the app directly. Because Glance returns screenshots inline and exposes the accessibility tree as text, Claude can reason about what is actually on the page rather than guessing based on code alone.
That makes it useful not only for login or signup tests, but also for regression checks on dashboards, pricing pages, navigation flows, and settings screens.
Glance also supports 12 assertion types, including:
existsnotExiststextContainstextEqualshasAttributehasClassisVisibleisEnabledurlContainsurlEqualscountEqualsconsoleNoErrors
This gives it enough structure to move beyond simple browsing and into real validation work.
Example test scenario
One of Glance’s strongest features is support for JSON-based multi-step scenarios. The repository gives examples like this login flow:
{
"name": "Login Flow",
"steps": [
{ "name": "Go to login", "action": "navigate", "url": "http://localhost:3000/login" },
{ "name": "Enter email", "action": "type", "selector": "input[type='email']", "value": "[email protected]" },
{ "name": "Enter password", "action": "type", "selector": "input[type='password']", "value": "password123" },
{ "name": "Click submit", "action": "click", "selector": "button[type='submit']" },
{ "name": "Wait for redirect", "action": "sleep", "ms": 2000 },
{ "name": "Verify dashboard", "action": "assert", "type": "urlContains", "expected": "/dashboard" },
{ "name": "Screenshot result", "action": "screenshot", "screenshotName": "post-login" }
]
}
This is important because it turns Glance into something reusable. It is not just a collection of ad hoc commands. It can also act as a structured testing layer that developers can save, rerun, and improve over time.
Configuration options
| Variable | Default | Purpose |
|---|---|---|
BROWSER_HEADLESS | true | Run browser without visible UI |
BROWSER_SESSIONS_DIR | .browser-sessions | Directory for screenshots and sessions |
BROWSER_SECURITY_PROFILE | local-dev | Security profile |
BROWSER_VIEWPORT_WIDTH | 1280 | Browser width |
BROWSER_VIEWPORT_HEIGHT | 720 | Browser height |
BROWSER_TIMEOUT | 30000 | Default timeout in milliseconds |
BROWSER_CHANNEL | — | Browser channel such as Chrome or Edge |
Security profiles
Glance does not leave browser automation fully unrestricted by default. Its README documents three security profiles:
| Profile | URL access | JS execution | Rate limit |
|---|---|---|---|
local-dev | All HTTP/HTTPS | Always allowed | 60/min |
restricted | Localhost only | Disabled | 30/min |
open | Everything | Always allowed | 120/min |
That is a useful design choice, because browser automation for local testing is very different from browser automation against broader external surfaces.
Claude Code integration and ready-made workflows
Glance ships with an e2e-tester Claude Code agent and a built-in /glance-test skill. According to the repository, the skill can take a URL, open it, capture a screenshot and accessibility snapshot, discover navigation links, test each page with assertions, inspect console output for JavaScript errors, and generate a pass/fail report.
That is a meaningful usability win. It means developers do not have to manually learn every single MCP tool before getting value from the project. They can start with a higher-level workflow and move into individual tools later as needed.
Requirements
To run Glance, the repository lists:
- Node.js 18+
- A Playwright-compatible browser, which Glance says is auto-installed
For local development of the MCP server itself, the documented flow includes cloning the repository, installing dependencies, installing Chromium through Playwright, building the project, and starting it.
Why Glance matters
Browser automation itself is not new. Playwright and Selenium have been around for years. What Glance changes is the interface: it packages browser automation as MCP tools designed for Claude Code, so that the agent can combine natural language reasoning, screenshots, DOM structure, console output, and network inspection in a single loop.
That makes browser testing feel much more native inside an AI-assisted development workflow. For developers already living in the terminal and using Claude Code as a coding copilot, that shift in ergonomics may matter more than the automation engine underneath.
Frequently Asked Questions
What is Glance exactly?
Glance is an MCP server for Claude Code that gives the model access to a real browser for navigation, interaction, screenshots, console inspection, network monitoring, and testing.
How many tools does it include?
The repository says it ships with 30 MCP tools, covering browser control, testing, session recording, and visual comparison.
Is it only for local development?
No. It can access broader HTTP/HTTPS surfaces depending on the configured security profile, although one profile, restricted, limits access to localhost only.
Can it test login and signup flows?
Yes. It includes a dedicated test_auth_flow tool, as well as JSON-based multi-step test scenarios and assertion support.
Does it support visual regression testing?
Yes. It can save visual baselines and compare future screenshots against them.
What does it require to run?
Node.js 18 or newer, plus a Playwright-compatible browser. The project says the browser dependency is auto-installed.