modelcontextprotocol/inspector
Watch
1
0
Fork
You've already forked inspector
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2

feat(web): migrate OAuth store to shared /store API (RemoteOAuthStorage parity) (closes #1548)

Browse source 
Migrate the web client's OAuth storage from BrowserOAuthStorage
(sessionStorage) to RemoteOAuthStorage, which POSTs through the backend's
/api/storage/oauth route to ~/.mcp-inspector/storage/oauth.json (mode 0600).
A credential obtained in the browser is now the same blob the TUI/CLI read
on the same host, giving web ⇄ TUI ⇄ CLI parity (Wave 1 of #1579).

Core (shared with TUI/CLI):
- OAuthStorageBase now drives a single async hydration (`ready()`,
  `getHydrationError()`); every post-redirect read (getClientInformation,
  getTokens, getCodeVerifier, getServerMetadata, getIdpSession) and every
  save awaits it so a late hydration merge cannot clobber a fresh write.
  getCodeVerifier/getServerMetadata become async; the store is created with
  skipHydration:true so there is no auto-hydration to race the explicit one.
- store.ts adds normalizeServerUrl so a token saved under
  https://Example.com/mcp is found when the CLI asks for
  https://example.com/mcp/; getServerState falls back to the raw key.
- remote-storage adapter POSTs with keepalive so the write survives the
  OAuth authorize redirect, surfaces swallowed persist failures, and gives
  richer read/write error messages.
- generateOAuthState throws instead of silently degrading to Math.random.
- NodeOAuthStorage honors MCP_INSPECTOR_OAUTH_STATE_PATH for isolated
  fixtures. Provider codeVerifier()/getServerMetadata() + the EMA idpOidc and
  connection-state readers await the now-async storage.

Web:
- environmentFactory + a new shared lib/remoteOAuthStorage accessor
  (memoized per {baseUrl, authToken}) wire RemoteOAuthStorage into the
  connection path, the EMA IdP hook, and the per-server "clear OAuth" action
  so all three share one in-memory view of oauth.json.

Tests: async-hydration + normalizeServerUrl suite, keepalive/error-path
coverage, and the sync→async migration across existing storage/provider/EMA
tests. Web validate + coverage gate + integration suite green; CLI/TUI/
launcher validate green.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01S3fTN8H3R8YV4yUGvZjYnX
This commit is contained in:
cliffhall 2026-07-01 18:39:17 -04:00
commit c299b6e9d8
2 changed files with 786 additions and 135 deletions
Download patch file Download diff file Expand all files Collapse all files

28
clients/web/src/test/integration/auth/node/storage.test.ts
View file

@ -4,6 +4,7 @@ import {
getOAuthStore,
clearAllOAuthClientState,
} from "@inspector/core/auth/node/storage-node.js";
import { normalizeServerUrl } from "@inspector/core/auth/store.js";
import type {
OAuthClientInformation,
OAuthTokens,
@ -341,9 +342,9 @@ describe("NodeOAuthStorage", () => {
it("clearCodeVerifier removes only the PKCE verifier", async () => {
await storage.saveCodeVerifier(testServerUrl, "verifier");
expect(storage.getCodeVerifier(testServerUrl)).toBe("verifier");
expect(await storage.getCodeVerifier(testServerUrl)).toBe("verifier");
storage.clearCodeVerifier(testServerUrl);
expect(storage.getCodeVerifier(testServerUrl)).toBeUndefined();
expect(await storage.getCodeVerifier(testServerUrl)).toBeUndefined();
});
it("clearScope removes only the scope", async () => {
@ -361,9 +362,9 @@ describe("NodeOAuthStorage", () => {
response_types_supported: ["code"],
};
await storage.saveServerMetadata(testServerUrl, metadata);
expect(storage.getServerMetadata(testServerUrl)).toEqual(metadata);
expect(await storage.getServerMetadata(testServerUrl)).toEqual(metadata);
storage.clearServerMetadata(testServerUrl);
expect(storage.getServerMetadata(testServerUrl)).toBeNull();
expect(await storage.getServerMetadata(testServerUrl)).toBeNull();
});
});
@ -505,9 +506,9 @@ describe("OAuth Store (Zustand)", () => {
const parsed = JSON.parse(
await fs.readFile(persistTestPath, "utf-8"),
) as StateShape;
expect(parsed.state.servers[serverUrl]?.clientInformation).toEqual(
clientInfo,
);
expect(
parsed.state.servers[normalizeServerUrl(serverUrl)]?.clientInformation,
).toEqual(clientInfo);
} finally {
try {
await fs.unlink(persistTestPath);
@ -582,9 +583,10 @@ describe("NodeOAuthStorage with custom storagePath", () => {
await fs.readFile(customPath, "utf-8"),
) as StateShape;
expect(parsed.state.servers[testServerUrl]?.tokens?.access_token).toBe(
tokens.access_token,
);
expect(
parsed.state.servers[normalizeServerUrl(testServerUrl)]?.tokens
?.access_token,
).toBe(tokens.access_token);
const stored = await storage.getTokens(testServerUrl);
expect(stored?.access_token).toBe(tokens.access_token);
@ -635,7 +637,13 @@ describe("NodeOAuthStorage with custom storagePath", () => {
);
try {
// The store is created with skipHydration: true; OAuthStorageBase
// normally drives rehydrate(), but this test writes via the raw store
// so hydrate it explicitly first (otherwise the later `new
// NodeOAuthStorage()` wrapper would drive the first rehydrate and clobber
// these unpersisted in-memory writes).
const defaultStore = getOAuthStore();
await defaultStore.persist.rehydrate();
defaultStore.getState().setServerState(testServerUrl, {
tokens: {
access_token: "default-token",

78
clients/web/src/test/integration/storage/adapters.test.ts
View file

@ -11,7 +11,10 @@ import { serve } from "@hono/node-server";
import type { ServerType } from "@hono/node-server";
import { createFileStorageAdapter } from "@inspector/core/storage/adapters/file-storage.js";
import { createRemoteStorageAdapter } from "@inspector/core/storage/adapters/remote-storage.js";
import { createOAuthStore } from "@inspector/core/auth/store.js";
import {
createOAuthStore,
normalizeServerUrl,
} from "@inspector/core/auth/store.js";
import { createRemoteApp } from "@inspector/core/mcp/remote/node/server.js";
import {
writeStoreFile,
@ -90,13 +93,46 @@ describe("Storage adapters", () => {
});
it("setItem throws when the POST fails", async () => {
// The adapter logs the swallowed-persist failure via console.error before
// rethrowing; suppress the expected noise.
const errorSpy = vi.spyOn(console, "error").mockImplementation(() => {});
try {
const fetchFn = vi
.fn<typeof fetch>()
.mockResolvedValueOnce(new Response("nope", { status: 500 }));
const adapter = makeAdapter(fetchFn as typeof fetch);
await expect(
adapter.setItem("name", { state: { a: 1 }, version: 0 }),
).rejects.toThrow(/500/);
expect(errorSpy).toHaveBeenCalled();
} finally {
errorSpy.mockRestore();
}
});
it("setItem sends keepalive so the POST survives an immediate redirect", async () => {
const fetchFn = vi
.fn<typeof fetch>()
.mockResolvedValueOnce(new Response("nope", { status: 500 }));
.mockResolvedValueOnce(new Response("{}"));
const adapter = makeAdapter(fetchFn as typeof fetch);
await expect(
adapter.setItem("name", { state: { a: 1 }, version: 0 }),
).rejects.toThrow(/500/);
await adapter.setItem("name", { state: { a: 1 }, version: 0 });
expect(fetchFn.mock.calls[0]?.[1]?.keepalive).toBe(true);
});
it("setItem rethrows a network-level fetch rejection after logging it", async () => {
const errorSpy = vi.spyOn(console, "error").mockImplementation(() => {});
try {
const fetchFn = vi
.fn<typeof fetch>()
.mockRejectedValueOnce(new Error("network down"));
const adapter = makeAdapter(fetchFn as typeof fetch);
await expect(
adapter.setItem("name", { state: { a: 1 }, version: 0 }),
).rejects.toThrow(/network down/);
expect(errorSpy).toHaveBeenCalled();
} finally {
errorSpy.mockRestore();
}
});
it("removeItem tolerates 404 but rethrows on other failures", async () => {
@ -155,7 +191,9 @@ describe("Storage adapters", () => {
await flushStoreFileWrites(filePath);
const fileContent = readFileSync(filePath, "utf-8");
const parsed = JSON.parse(fileContent);
expect(parsed.state.servers["https://example.com"].tokens).toEqual({
expect(
parsed.state.servers[normalizeServerUrl("https://example.com")].tokens,
).toEqual({
access_token: "test-token",
token_type: "Bearer",
});
@ -173,10 +211,12 @@ describe("Storage adapters", () => {
});
await flushStoreFileWrites(filePath);
// Create new store instance (should load persisted state)
// Create new store instance and load persisted state. The store is
// created with skipHydration: true, so drive the single rehydrate
// explicitly (OAuthStorageBase does this in production).
const storage2 = createFileStorageAdapter({ filePath });
const store2 = createOAuthStore(storage2);
await new Promise((resolve) => setTimeout(resolve, 100));
await store2.persist.rehydrate();
const state = store2.getState().getServerState("https://example.com");
expect(state.tokens).toEqual({
@ -332,6 +372,7 @@ describe("Storage adapters", () => {
tokens: { access_token: "test-token", token_type: "Bearer" },
});
const exampleKey = normalizeServerUrl("https://example.com");
await waitForRemoteStore(baseUrl, "test-store", authToken, (body) => {
const d = body as {
state?: {
@ -339,8 +380,7 @@ describe("Storage adapters", () => {
};
};
return (
d?.state?.servers?.["https://example.com"]?.tokens?.access_token ===
"test-token"
d?.state?.servers?.[exampleKey]?.tokens?.access_token === "test-token"
);
});
@ -353,7 +393,7 @@ describe("Storage adapters", () => {
});
expect(res.status).toBe(200);
const storeData = await res.json();
expect(storeData.state.servers["https://example.com"].tokens).toEqual({
expect(storeData.state.servers[exampleKey].tokens).toEqual({
access_token: "test-token",
token_type: "Bearer",
});
@ -376,6 +416,7 @@ describe("Storage adapters", () => {
store1.getState().setServerState("https://example.com", {
tokens: { access_token: "initial-token", token_type: "Bearer" },
});
const exampleKey = normalizeServerUrl("https://example.com");
await waitForRemoteStore(baseUrl, "test-store", authToken, (body) => {
const d = body as {
state?: {
@ -383,26 +424,21 @@ describe("Storage adapters", () => {
};
};
return (
d?.state?.servers?.["https://example.com"]?.tokens?.access_token ===
d?.state?.servers?.[exampleKey]?.tokens?.access_token ===
"initial-token"
);
});
// Create new store instance (should load persisted state)
// Create new store instance and load persisted state. The store is
// created with skipHydration: true, so drive the single rehydrate
// explicitly (OAuthStorageBase does this in production).
const storage2 = createRemoteStorageAdapter({
baseUrl,
storeId: "test-store",
authToken,
});
const store2 = createOAuthStore(storage2);
await vi.waitFor(
() => {
const state = store2.getState().getServerState("https://example.com");
if (!state.tokens) throw new Error("Store not yet hydrated");
return state;
},
{ timeout: 2000, interval: 50 },
);
await store2.persist.rehydrate();
const state = store2.getState().getServerState("https://example.com");
expect(state.tokens).toEqual({