# Mcp Shark Viewer Vscode

> MCP Shark Viewer integrates MCP Shark into VS Code/Cursor so you can inspect MCP traffic without leaving your IDE

- **Type:** MCP server
- **Install:** `agentstack add mcp-mcp-shark-mcp-shark-viewer-vscode`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [mcp-shark](https://agentstack.voostack.com/s/mcp-shark)
- **Installs:** 0
- **Category:** [Developer Tools](https://agentstack.voostack.com/c/developer-tools)
- **Latest version:** 0.1.0
- **License:** Apache-2.0
- **Upstream author:** [mcp-shark](https://github.com/mcp-shark)
- **Source:** https://github.com/mcp-shark/mcp-shark-viewer-vscode
- **Website:** https://mcpshark.sh/

## Install

```sh
agentstack add mcp-mcp-shark-mcp-shark-viewer-vscode
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

MCP Shark Viewer (VS Code / Cursor)

  Inspect MCP traffic inside your IDE. Start/stop MCP Shark, open the inspector, and embed the MCP Shark UI in a webview.

  

## Table of Contents

- [About](#about)
- [Features](#features)
- [Commands](#commands)
- [Getting Started](#getting-started)
- [Requirements](#requirements)
- [Install (VSIX)](#install-vsix)
- [Troubleshooting](#troubleshooting)
- [Development](#development)
- [Scripts](#scripts)
- [Docs](#docs)
- [Repo Layout](#repo-layout)
- [License](#license)

## About

This extension integrates **MCP Shark** into **VS Code / Cursor** (and other VS Code-compatible IDEs). It provides:

- A sidebar view (Activity Bar) to access the inspector quickly
- Commands to start/stop MCP Shark from the Command Palette
- An embedded MCP Shark UI panel (webview iframe)

MCP Shark (the server + UI) is the upstream project: [mcp-shark/mcp-shark](https://github.com/mcp-shark/mcp-shark/tree/main). For MCP Shark install/usage, see the upstream README: [README](https://github.com/mcp-shark/mcp-shark/blob/main/README.md).

## Features

- **Traffic Inspector View**: Activity Bar view `Traffic Inspector` (`mcp-shark-traffic`).
- **Embedded UI**: Webview panel that iframes the MCP Shark UI (`http://localhost:9853`).
- **Server lifecycle**: start/stop MCP Shark from inside the IDE.
- **Settings fetch**: when MCP Shark is reachable, the extension calls `GET /api/settings` (API reference: [GET /api/settings](https://github.com/mcp-shark/mcp-shark/blob/main/docs/api-reference.md#get-apisettings)).

## Commands

| Command | Palette Title |
| --- | --- |
| `mcp-shark.viewer.startServer` | Start MCP Shark Server |
| `mcp-shark.viewer.stopServer` | Stop MCP Shark Server |
| `mcp-shark.viewer.openInspector` | Open Traffic Inspector |
| `mcp-shark.viewer.showDatabasePanel` | MCP Shark Traffic inspector |
| `mcp-shark.viewer.refresh` | Refresh |

## Getting Started

1. Open the Activity Bar → **MCP Shark** → **Traffic Inspector**
2. Run **Start MCP Shark Server** (Command Palette)
3. Run **Open Traffic Inspector** to open the embedded UI panel
4. In the MCP Shark UI, go to **MCP Server Setup** and **start the MCP server** (select your IDE config / servers, then click **Start MCP Shark**)
5. For full MCP Shark first-run + setup instructions, see: [Getting Started](https://github.com/mcp-shark/mcp-shark/blob/main/docs/getting-started.md)
6. For MCP Shark install/CLI usage, see the upstream README: [mcp-shark/mcp-shark README](https://github.com/mcp-shark/mcp-shark/blob/main/README.md)

## Requirements

- **IDE**: VS Code / Cursor
- **Node.js**: required if you want the extension to auto-start MCP Shark via `npx -y @mcp-shark/mcp-shark` (MCP Shark requires Node 18+; see upstream README: [mcp-shark/mcp-shark README](https://github.com/mcp-shark/mcp-shark/blob/main/README.md))

## Install (VSIX)

Package:

```bash
vsce package
# or:
# npx @vscode/vsce package
```

Install into Cursor / VS Code:

```bash
cursor --install-extension mcp-shark-viewer-for-vscode-0.0.1.vsix
code --install-extension mcp-shark-viewer-for-vscode-0.0.1.vsix
```

See also: `docs/How.md`.

## Troubleshooting

- **UI opens but server isn’t “running”**: MCP Shark’s UI can be up even if an external MCP server failed to start. Open the MCP Shark UI and check the setup/logs (upstream docs: [mcp-shark/mcp-shark](https://github.com/mcp-shark/mcp-shark/tree/main)).
- **Port already in use (9853)**: another MCP Shark instance (or other process) is already bound to `9853`. Stop it and try again.
- **Start fails inside IDE**: ensure `npx` is available in the IDE environment and you can run `npx -y @mcp-shark/mcp-shark` in a terminal.

## Development

- Open this repo in VS Code/Cursor
- Press **F5** to launch an **Extension Development Host**
- Run:
  - `npm run validate`
  - `npm run lint`

## Scripts

- **validate**: `npm run validate` (runs `node scripts/validate.js`)
- **lint**: `npm run lint` (Biome)
- **format**: `npm run format`
- **check**: `npm run check`

## Docs

- **Install/Package**: `docs/How.md`
- **Validation workflow**: `docs/VALIDATION_PLAN.md`

## Repo Layout

- **Root entrypoint**: `extension.js` (thin shim exporting from `src/`)
- **Source**: `src/`
- **Validator**: `scripts/validate.js`
- **Docs**: `docs/`
- **Webview assets**: `media/` (e.g. `media/image.png`)

## License

See `LICENSE`.

## Source & license

This open-source MCP server is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [mcp-shark](https://github.com/mcp-shark)
- **Source:** [mcp-shark/mcp-shark-viewer-vscode](https://github.com/mcp-shark/mcp-shark-viewer-vscode)
- **License:** Apache-2.0
- **Homepage:** https://mcpshark.sh/

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/mcp-mcp-shark-mcp-shark-viewer-vscode
- Seller: https://agentstack.voostack.com/s/mcp-shark
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.