@modelcontextprotocol/inspector 0.16.1 → 0.16.3

package/README.md

@@ -166,6 +166,12 @@ If you need to disable authentication (NOT RECOMMENDED), you can set the `DANGER
 DANGEROUSLY_OMIT_AUTH=true npm start
 ```
 
+You can also set the token via the `MCP_PROXY_AUTH_TOKEN` environment variable when starting the server:
+
+```bash
+MCP_PROXY_AUTH_TOKEN=$(openssl rand -hex 32) npm start
+```
+
 #### Local-only Binding
 
 By default, both the MCP Inspector proxy server and client bind only to `localhost` to prevent network access. This ensures they are not accessible from other devices on the network. If you need to bind to all interfaces for development purposes, you can override this with the `HOST` environment variable:
@@ -228,6 +234,78 @@ Example server configuration file:
 }
 ```
 
+#### Transport Types in Config Files
+
+The inspector automatically detects the transport type from your config file. You can specify different transport types:
+
+**STDIO (default):**
+
+```json
+{
+  "mcpServers": {
+    "my-stdio-server": {
+      "type": "stdio",
+      "command": "npx",
+      "args": ["@modelcontextprotocol/server-everything"]
+    }
+  }
+}
+```
+
+**SSE (Server-Sent Events):**
+
+```json
+{
+  "mcpServers": {
+    "my-sse-server": {
+      "type": "sse",
+      "url": "http://localhost:3000/sse"
+    }
+  }
+}
+```
+
+**Streamable HTTP:**
+
+```json
+{
+  "mcpServers": {
+    "my-http-server": {
+      "type": "streamable-http",
+      "url": "http://localhost:3000/mcp"
+    }
+  }
+}
+```
+
+#### Default Server Selection
+
+You can launch the inspector without specifying a server name if your config has:
+
+1. **A single server** - automatically selected:
+
+```bash
+# Automatically uses "my-server" if it's the only one
+npx @modelcontextprotocol/inspector --config mcp.json
+```
+
+2. **A server named "default-server"** - automatically selected:
+
+```json
+{
+  "mcpServers": {
+    "default-server": {
+      "command": "npx",
+      "args": ["@modelcontextprotocol/server-everything"]
+    },
+    "other-server": {
+      "command": "node",
+      "args": ["other.js"]
+    }
+  }
+}
+```
+
 > **Tip:** You can easily generate this configuration format using the **Server Entry** and **Servers File** buttons in the Inspector UI, as described in the Servers File Export section above.
 
 You can also set the initial `transport` type, `serverUrl`, `serverCommand`, and `serverArgs` via query params, for example:
@@ -309,7 +387,7 @@ npx @modelcontextprotocol/inspector --cli node build/index.js --method prompts/l
 npx @modelcontextprotocol/inspector --cli https://my-mcp-server.example.com
 
 # Connect to a remote MCP server (with Streamable HTTP transport)
-npx @modelcontextprotocol/inspector --cli https://my-mcp-server.example.com --transport http
+npx @modelcontextprotocol/inspector --cli https://my-mcp-server.example.com --transport http --method tools/list
 
 # Call a tool on a remote server
 npx @modelcontextprotocol/inspector --cli https://my-mcp-server.example.com --method tools/call --tool-name remotetool --tool-arg param=value

package/cli/build/cli.js

@@ -32,8 +32,26 @@ async function runWebClient(args) {
         cancelled = true;
         abort.abort();
     });
+    // Build arguments to pass to start.js
+    const startArgs = [];
+    // Pass environment variables
+    for (const [key, value] of Object.entries(args.envArgs)) {
+        startArgs.push("-e", `${key}=${value}`);
+    }
+    // Pass transport type if specified
+    if (args.transport) {
+        startArgs.push("--transport", args.transport);
+    }
+    // Pass server URL if specified
+    if (args.serverUrl) {
+        startArgs.push("--server-url", args.serverUrl);
+    }
+    // Pass command and args (using -- to separate them)
+    if (args.command) {
+        startArgs.push("--", args.command, ...args.args);
+    }
     try {
-        await spawnPromise("node", [inspectorClientPath], {
+        await spawnPromise("node", [inspectorClientPath, ...startArgs], {
             signal: abort.signal,
             echoOutput: true,
         });
@@ -53,7 +71,17 @@ async function runCli(args) {
         abort.abort();
     });
     try {
-        await spawnPromise("node", [cliPath, args.command, ...args.args], {
+        // Build CLI arguments
+        const cliArgs = [cliPath];
+        // Add transport flag if specified
+        if (args.transport && args.transport !== "stdio") {
+            // Convert streamable-http back to http for CLI mode
+            const cliTransport = args.transport === "streamable-http" ? "http" : args.transport;
+            cliArgs.push("--transport", cliTransport);
+        }
+        // Add command and remaining args
+        cliArgs.push(args.command, ...args.args);
+        await spawnPromise("node", cliArgs, {
             env: { ...process.env, ...args.envArgs },
             signal: abort.signal,
             echoOutput: true,
@@ -114,38 +142,88 @@ function parseArgs() {
         .option("-e <env>", "environment variables in KEY=VALUE format", parseKeyValuePair, {})
         .option("--config <path>", "config file path")
         .option("--server <n>", "server name from config file")
-        .option("--cli", "enable CLI mode");
+        .option("--cli", "enable CLI mode")
+        .option("--transport <type>", "transport type (stdio, sse, http)")
+        .option("--server-url <url>", "server URL for SSE/HTTP transport");
     // Parse only the arguments before --
     program.parse(preArgs);
     const options = program.opts();
     const remainingArgs = program.args;
     // Add back any arguments that came after --
     const finalArgs = [...remainingArgs, ...postArgs];
-    // Validate that config and server are provided together
-    if ((options.config && !options.server) ||
-        (!options.config && options.server)) {
-        throw new Error("Both --config and --server must be provided together. If you specify one, you must specify the other.");
+    // Validate config and server options
+    if (!options.config && options.server) {
+        throw new Error("--server requires --config to be specified");
+    }
+    // If config is provided without server, try to auto-select
+    if (options.config && !options.server) {
+        const configContent = fs.readFileSync(path.isAbsolute(options.config)
+            ? options.config
+            : path.resolve(process.cwd(), options.config), "utf8");
+        const parsedConfig = JSON.parse(configContent);
+        const servers = Object.keys(parsedConfig.mcpServers || {});
+        if (servers.length === 1) {
+            // Use the only server if there's just one
+            options.server = servers[0];
+        }
+        else if (servers.length === 0) {
+            throw new Error("No servers found in config file");
+        }
+        else {
+            // Multiple servers, require explicit selection
+            throw new Error(`Multiple servers found in config file. Please specify one with --server.\nAvailable servers: ${servers.join(", ")}`);
+        }
     }
     // If config file is specified, load and use the options from the file. We must merge the args
     // from the command line and the file together, or we will miss the method options (--method,
     // etc.)
     if (options.config && options.server) {
         const config = loadConfigFile(options.config, options.server);
-        return {
-            command: config.command,
-            args: [...(config.args || []), ...finalArgs],
-            envArgs: { ...(config.env || {}), ...(options.e || {}) },
-            cli: options.cli || false,
-        };
+        if (config.type === "stdio") {
+            return {
+                command: config.command,
+                args: [...(config.args || []), ...finalArgs],
+                envArgs: { ...(config.env || {}), ...(options.e || {}) },
+                cli: options.cli || false,
+                transport: "stdio",
+            };
+        }
+        else if (config.type === "sse" || config.type === "streamable-http") {
+            return {
+                command: config.url,
+                args: finalArgs,
+                envArgs: options.e || {},
+                cli: options.cli || false,
+                transport: config.type,
+                serverUrl: config.url,
+            };
+        }
+        else {
+            // Backwards compatibility: if no type field, assume stdio
+            return {
+                command: config.command || "",
+                args: [...(config.args || []), ...finalArgs],
+                envArgs: { ...(config.env || {}), ...(options.e || {}) },
+                cli: options.cli || false,
+                transport: "stdio",
+            };
+        }
     }
     // Otherwise use command line arguments
     const command = finalArgs[0] || "";
     const args = finalArgs.slice(1);
+    // Map "http" shorthand to "streamable-http"
+    let transport = options.transport;
+    if (transport === "http") {
+        transport = "streamable-http";
+    }
     return {
         command,
         args,
         envArgs: options.e || {},
         cli: options.cli || false,
+        transport: transport,
+        serverUrl: options.serverUrl,
     };
 }
 async function main() {
@@ -155,7 +233,7 @@ async function main() {
     try {
         const args = parseArgs();
         if (args.cli) {
-            runCli(args);
+            await runCli(args);
         }
         else {
             await runWebClient(args);

package/cli/build/client/connection.js

@@ -8,6 +8,11 @@ export const validLogLevels = [
 export async function connect(client, transport) {
     try {
         await client.connect(transport);
+        if (client.getServerCapabilities()?.logging) {
+            // default logging level is undefined in the spec, but the user of the
+            // inspector most likely wants debug.
+            await client.setLoggingLevel("debug");
+        }
     }
     catch (error) {
         throw new Error(`Failed to connect to MCP server: ${error instanceof Error ? error.message : String(error)}`);

package/cli/build/index.js

@@ -193,6 +193,8 @@ async function main() {
     try {
         const args = parseArgs();
         await callMethod(args);
+        // Explicitly exit to ensure process terminates in CI
+        process.exit(0);
     }
     catch (error) {
         handleError(error);

package/cli/build/transport.js

@@ -2,20 +2,6 @@ import { SSEClientTransport } from "@modelcontextprotocol/sdk/client/sse.js";
 import { getDefaultEnvironment, StdioClientTransport, } from "@modelcontextprotocol/sdk/client/stdio.js";
 import { StreamableHTTPClientTransport } from "@modelcontextprotocol/sdk/client/streamableHttp.js";
 import { findActualExecutable } from "spawn-rx";
-function createSSETransport(options) {
-    const baseUrl = new URL(options.url ?? "");
-    const sseUrl = baseUrl.pathname.endsWith("/sse")
-        ? baseUrl
-        : new URL("/sse", baseUrl);
-    return new SSEClientTransport(sseUrl);
-}
-function createHTTPTransport(options) {
-    const baseUrl = new URL(options.url ?? "");
-    const mcpUrl = baseUrl.pathname.endsWith("/mcp")
-        ? baseUrl
-        : new URL("/mcp", baseUrl);
-    return new StreamableHTTPClientTransport(mcpUrl);
-}
 function createStdioTransport(options) {
     let args = [];
     if (options.args !== undefined) {
@@ -46,11 +32,16 @@ export function createTransport(options) {
         if (transportType === "stdio") {
             return createStdioTransport(options);
         }
+        // If not STDIO, then it must be either SSE or HTTP.
+        if (!options.url) {
+            throw new Error("URL must be provided for SSE or HTTP transport types.");
+        }
+        const url = new URL(options.url);
         if (transportType === "sse") {
-            return createSSETransport(options);
+            return new SSEClientTransport(url);
         }
         if (transportType === "http") {
-            return createHTTPTransport(options);
+            return new StreamableHTTPClientTransport(url);
         }
         throw new Error(`Unsupported transport type: ${transportType}`);
     }

package/client/bin/start.js

@@ -28,8 +28,15 @@ function getClientUrl(port, authDisabled, sessionToken, serverPort) {
 }
 
 async function startDevServer(serverOptions) {
-  const { SERVER_PORT, CLIENT_PORT, sessionToken, envVars, abort } =
-    serverOptions;
+  const {
+    SERVER_PORT,
+    CLIENT_PORT,
+    sessionToken,
+    envVars,
+    abort,
+    transport,
+    serverUrl,
+  } = serverOptions;
   const serverCommand = "npx";
   const serverArgs = ["tsx", "watch", "--clear-screen=false", "src/index.ts"];
   const isWindows = process.platform === "win32";
@@ -40,8 +47,10 @@ async function startDevServer(serverOptions) {
       ...process.env,
       SERVER_PORT,
       CLIENT_PORT,
-      MCP_PROXY_TOKEN: sessionToken,
+      MCP_PROXY_AUTH_TOKEN: sessionToken,
       MCP_ENV_VARS: JSON.stringify(envVars),
+      ...(transport ? { MCP_TRANSPORT: transport } : {}),
+      ...(serverUrl ? { MCP_SERVER_URL: serverUrl } : {}),
     },
     signal: abort.signal,
     echoOutput: true,
@@ -78,6 +87,8 @@ async function startProdServer(serverOptions) {
     abort,
     command,
     mcpServerArgs,
+    transport,
+    serverUrl,
   } = serverOptions;
   const inspectorServerPath = resolve(
     __dirname,
@@ -91,15 +102,19 @@ async function startProdServer(serverOptions) {
     "node",
     [
       inspectorServerPath,
-      ...(command ? [`--env`, command] : []),
-      ...(mcpServerArgs ? [`--args=${mcpServerArgs.join(" ")}`] : []),
+      ...(command ? [`--command=${command}`] : []),
+      ...(mcpServerArgs && mcpServerArgs.length > 0
+        ? [`--args=${mcpServerArgs.join(" ")}`]
+        : []),
+      ...(transport ? [`--transport=${transport}`] : []),
+      ...(serverUrl ? [`--server-url=${serverUrl}`] : []),
     ],
     {
       env: {
         ...process.env,
         SERVER_PORT,
         CLIENT_PORT,
-        MCP_PROXY_TOKEN: sessionToken,
+        MCP_PROXY_AUTH_TOKEN: sessionToken,
         MCP_ENV_VARS: JSON.stringify(envVars),
       },
       signal: abort.signal,
@@ -206,6 +221,8 @@ async function main() {
   let command = null;
   let parsingFlags = true;
   let isDev = false;
+  let transport = null;
+  let serverUrl = null;
 
   for (let i = 0; i < args.length; i++) {
     const arg = args[i];
@@ -220,6 +237,16 @@ async function main() {
       continue;
     }
 
+    if (parsingFlags && arg === "--transport" && i + 1 < args.length) {
+      transport = args[++i];
+      continue;
+    }
+
+    if (parsingFlags && arg === "--server-url" && i + 1 < args.length) {
+      serverUrl = args[++i];
+      continue;
+    }
+
     if (parsingFlags && arg === "-e" && i + 1 < args.length) {
       const envVar = args[++i];
       const equalsIndex = envVar.indexOf("=");
@@ -247,8 +274,9 @@ async function main() {
       : "Starting MCP inspector...",
   );
 
-  // Generate session token for authentication
-  const sessionToken = randomBytes(32).toString("hex");
+  // Use provided token from environment or generate a new one
+  const sessionToken =
+    process.env.MCP_PROXY_AUTH_TOKEN || randomBytes(32).toString("hex");
   const authDisabled = !!process.env.DANGEROUSLY_OMIT_AUTH;
 
   const abort = new AbortController();
@@ -270,6 +298,8 @@ async function main() {
       abort,
       command,
       mcpServerArgs,
+      transport,
+      serverUrl,
     };
 
     const result = isDev

package/client/dist/assets/{OAuthCallback-CaDIOg8Q.js → OAuthCallback-DCwiUoWl.js}

@@ -1,4 +1,4 @@
-import { u as useToast, r as reactExports, j as jsxRuntimeExports, S as SESSION_KEYS, I as InspectorOAuthClientProvider, a as auth } from "./index-CPgI0-gs.js";
+import { u as useToast, r as reactExports, j as jsxRuntimeExports, S as SESSION_KEYS, I as InspectorOAuthClientProvider, a as auth } from "./index-CHDvjhl9.js";
 import { p as parseOAuthCallbackParams, g as generateOAuthErrorDescription } from "./oauthUtils-DTcoXpSP.js";
 const OAuthCallback = ({ onConnect }) => {
   const { toast } = useToast();

package/client/dist/assets/{OAuthDebugCallback-Ccjj44Wa.js → OAuthDebugCallback-BNuktUej.js}

@@ -1,4 +1,4 @@
-import { r as reactExports, S as SESSION_KEYS, j as jsxRuntimeExports } from "./index-CPgI0-gs.js";
+import { r as reactExports, S as SESSION_KEYS, j as jsxRuntimeExports } from "./index-CHDvjhl9.js";
 import { p as parseOAuthCallbackParams, g as generateOAuthErrorDescription } from "./oauthUtils-DTcoXpSP.js";
 const OAuthDebugCallback = ({ onConnect }) => {
   reactExports.useEffect(() => {

package/client/dist/assets/{index-BwWj6LL9.css → index-BWZfLo5E.css}

@@ -56,8 +56,6 @@ pre[class*="language-"] {
 	-moz-tab-size: 4;
 	-o-tab-size: 4;
 	tab-size: 4;
-
-	-webkit-hyphens: none;
 	hyphens: none;
 }
 
@@ -757,6 +755,9 @@ video {
 .collapse {
   visibility: collapse;
 }
+.static {
+  position: static;
+}
 .fixed {
   position: fixed;
 }
@@ -994,6 +995,9 @@ video {
 .w-full {
   width: 100%;
 }
+.min-w-0 {
+  min-width: 0px;
+}
 .min-w-\[8rem\] {
   min-width: 8rem;
 }
@@ -1171,6 +1175,9 @@ video {
 .border {
   border-width: 1px;
 }
+.border-2 {
+  border-width: 2px;
+}
 .border-b {
   border-bottom-width: 1px;
 }
@@ -1191,6 +1198,10 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(147 197 253 / var(--tw-border-opacity, 1));
 }
+.border-blue-500 {
+  --tw-border-opacity: 1;
+  border-color: rgb(59 130 246 / var(--tw-border-opacity, 1));
+}
 .border-border {
   border-color: hsl(var(--border));
 }
@@ -1204,6 +1215,10 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
 }
+.border-gray-300 {
+  --tw-border-opacity: 1;
+  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
+}
 .border-green-200 {
   --tw-border-opacity: 1;
   border-color: rgb(187 247 208 / var(--tw-border-opacity, 1));
@@ -1226,6 +1241,9 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(239 68 68 / var(--tw-border-opacity, 1));
 }
+.border-t-transparent {
+  border-top-color: transparent;
+}
 .bg-accent {
   background-color: hsl(var(--accent));
 }
@@ -1325,6 +1343,10 @@ video {
 .p-6 {
   padding: 1.5rem;
 }
+.px-1 {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
 .px-12 {
   padding-left: 3rem;
   padding-right: 3rem;
@@ -1349,6 +1371,10 @@ video {
   padding-top: 0px;
   padding-bottom: 0px;
 }
+.py-0\.5 {
+  padding-top: 0.125rem;
+  padding-bottom: 0.125rem;
+}
 .py-1 {
   padding-top: 0.25rem;
   padding-bottom: 0.25rem;
@@ -1424,6 +1450,9 @@ video {
 .leading-none {
   line-height: 1;
 }
+.leading-relaxed {
+  line-height: 1.625;
+}
 .tracking-tight {
   letter-spacing: -0.025em;
 }
@@ -1600,9 +1629,7 @@ video {
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
 .transition {
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
   transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
@@ -1796,6 +1823,11 @@ h1 {
   color: rgb(29 78 216 / var(--tw-text-opacity, 1));
 }
 
+.hover\:text-blue-800:hover {
+  --tw-text-opacity: 1;
+  color: rgb(30 64 175 / var(--tw-text-opacity, 1));
+}
+
 .hover\:text-foreground:hover {
   color: hsl(var(--foreground));
 }
@@ -1837,6 +1869,11 @@ h1 {
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
 
+.focus\:ring-blue-500:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));
+}
+
 .focus\:ring-ring:focus {
   --tw-ring-color: hsl(var(--ring));
 }
@@ -1862,10 +1899,19 @@ h1 {
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
 
+.focus-visible\:ring-blue-500:focus-visible {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity, 1));
+}
+
 .focus-visible\:ring-ring:focus-visible {
   --tw-ring-color: hsl(var(--ring));
 }
 
+.focus-visible\:ring-offset-1:focus-visible {
+  --tw-ring-offset-width: 1px;
+}
+
 .focus-visible\:ring-offset-2:focus-visible {
   --tw-ring-offset-width: 2px;
 }
@@ -2139,11 +2185,21 @@ h1 {
   border-color: hsl(var(--destructive));
 }
 
+.dark\:border-gray-600:is(.dark *) {
+  --tw-border-opacity: 1;
+  border-color: rgb(75 85 99 / var(--tw-border-opacity, 1));
+}
+
 .dark\:border-gray-800:is(.dark *) {
   --tw-border-opacity: 1;
   border-color: rgb(31 41 55 / var(--tw-border-opacity, 1));
 }
 
+.dark\:border-red-800:is(.dark *) {
+  --tw-border-opacity: 1;
+  border-color: rgb(153 27 27 / var(--tw-border-opacity, 1));
+}
+
 .dark\:bg-blue-900:is(.dark *) {
   --tw-bg-opacity: 1;
   background-color: rgb(30 58 138 / var(--tw-bg-opacity, 1));
@@ -2169,6 +2225,10 @@ h1 {
   background-color: rgb(127 29 29 / var(--tw-bg-opacity, 1));
 }
 
+.dark\:bg-red-900\/20:is(.dark *) {
+  background-color: rgb(127 29 29 / 0.2);
+}
+
 .dark\:bg-yellow-900:is(.dark *) {
   --tw-bg-opacity: 1;
   background-color: rgb(113 63 18 / var(--tw-bg-opacity, 1));
@@ -2179,6 +2239,11 @@ h1 {
   color: rgb(191 219 254 / var(--tw-text-opacity, 1));
 }
 
+.dark\:text-blue-400:is(.dark *) {
+  --tw-text-opacity: 1;
+  color: rgb(96 165 250 / var(--tw-text-opacity, 1));
+}
+
 .dark\:text-gray-100:is(.dark *) {
   --tw-text-opacity: 1;
   color: rgb(243 244 246 / var(--tw-text-opacity, 1));
@@ -2209,6 +2274,11 @@ h1 {
   color: rgb(254 202 202 / var(--tw-text-opacity, 1));
 }
 
+.dark\:text-red-400:is(.dark *) {
+  --tw-text-opacity: 1;
+  color: rgb(248 113 113 / var(--tw-text-opacity, 1));
+}
+
 .dark\:text-white:is(.dark *) {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity, 1));
@@ -2236,6 +2306,11 @@ h1 {
   background-color: hsl(var(--secondary));
 }
 
+.dark\:hover\:text-blue-300:hover:is(.dark *) {
+  --tw-text-opacity: 1;
+  color: rgb(147 197 253 / var(--tw-text-opacity, 1));
+}
+
 .group:hover .dark\:group-hover\:text-gray-100:is(.dark *) {
   --tw-text-opacity: 1;
   color: rgb(243 244 246 / var(--tw-text-opacity, 1));