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

Merge pull request #2050 from modelcontextprotocol/v2/fix/2049-unhandled-list-reload-rejections

Browse source 
fix: handle background command rejections in App (#2049)
This commit is contained in:
Cliff Hall 2026-08-18 12:53:12 -04:00 • committed by GitHub
commit b020709d51
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 229 additions and 65 deletions
Download patch file Download diff file Expand all files Collapse all files

155
clients/web/src/App.test.tsx
View file

@ -579,6 +579,8 @@ import {
import * as McpIndex from "@inspector/core/mcp/index.js";
import * as FetchLogModule from "@inspector/core/mcp/state/fetchRequestLogState.js";
import { useManagedRequestorTasks } from "@inspector/core/react/useManagedRequestorTasks.js";
import { useManagedTools } from "@inspector/core/react/useManagedTools.js";
import { usePagedTools } from "@inspector/core/react/usePagedTools.js";
import { useMessageLog } from "@inspector/core/react/useMessageLog.js";
import { useInspectorClient } from "@inspector/core/react/useInspectorClient.js";
import { useSettingsDraft } from "@inspector/core/react/useSettingsDraft.js";
@ -2422,3 +2424,156 @@ describe("App paginated list pagination toggle (#1721)", () => {
expect(lastPush?.paginatedLists).toBeFalsy();
});
});
// A background command runs through `runCommandInBackground`, which owns the
// rejection. Before #2049 the 17 `void runWithCommandAuthRecovery(...)` sites
// had no handler, so any non-auth failure of the wrapped operation became an
// unhandled rejection in the browser — invisible to the type-aware
// no-floating-promises rule (`void` is its sanctioned suppression) and fatal to
// `smoke:web:browser`, which hard-fails on exactly that signal.
describe("App background command rejections (#2049)", () => {
const LIST_FAILURE = new Error("list boom");
/**
* Record process-level unhandled rejections for the duration of a test.
* Asserting on the captured list — rather than relying on vitest failing the
* whole run — is what attributes a regression to this test rather than to
* whichever file happened to be running when the rejection surfaced.
*/
const captureUnhandledRejections = () => {
const seen: unknown[] = [];
const onUnhandled = (reason: unknown) => {
seen.push(reason);
};
process.on("unhandledRejection", onUnhandled);
return {
seen,
stop: () => {
process.off("unhandledRejection", onUnhandled);
},
};
};
// Node reports an unhandled rejection at the end of the turn, so drain the
// macrotask queue before asserting that none was reported.
const settleRejections = async () => {
await act(async () => {
await new Promise((resolve) => setTimeout(resolve, 0));
});
await act(async () => {
await new Promise((resolve) => setTimeout(resolve, 0));
});
};
beforeEach(() => {
clientInstances.length = 0;
notificationsMock.show.mockClear();
});
afterEach(() => {
// Restore the module defaults the other blocks render against.
vi.mocked(useManagedTools).mockReturnValue({
tools: [{ name: "get_acts", inputSchema: { type: "object" } }],
error: null,
listChanged: false,
refresh: vi.fn().mockResolvedValue([]),
clearListChanged: clearToolsListChangedSpy,
});
vi.mocked(usePagedTools).mockReturnValue({
tools: [],
nextCursor: undefined,
pageCount: 0,
error: null,
loadPage: vi.fn(() =>
Promise.resolve({ tools: [], nextCursor: undefined }),
),
clear: vi.fn(),
});
});
const connect = async () => {
const user = userEvent.setup();
renderWithMantine(<App />);
await user.click(screen.getByText("connect"));
await waitFor(() => expect(clientInstances).toHaveLength(1));
return user;
};
it("does not leak an unhandled rejection when an all-pages Refresh fails", async () => {
vi.mocked(useManagedTools).mockReturnValue({
tools: [],
error: LIST_FAILURE,
listChanged: false,
refresh: vi.fn().mockRejectedValue(LIST_FAILURE),
clearListChanged: clearToolsListChangedSpy,
});
const rejections = captureUnhandledRejections();
try {
const user = await connect();
await user.click(screen.getByText("refresh-tools"));
await settleRejections();
expect(rejections.seen).toEqual([]);
} finally {
rejections.stop();
}
// The panel already renders the failure with a Retry, so no toast is added
// on top of it — that is the whole reason this site swallows the rejection.
expect(notificationsMock.show).not.toHaveBeenCalled();
});
it("does not leak an unhandled rejection when a paginated Refresh or Load-next-page fails", async () => {
vi.mocked(usePagedTools).mockReturnValue({
tools: [],
// A cursor is what makes Load-next-page actually fetch.
nextCursor: "cursor-1",
pageCount: 1,
error: LIST_FAILURE,
loadPage: vi.fn().mockRejectedValue(LIST_FAILURE),
clear: vi.fn(),
});
const rejections = captureUnhandledRejections();
try {
const user = await connect();
// Flipping the mode drives its own page-1 load, which fails too.
await user.click(screen.getByText("paginated-on"));
await waitFor(() =>
expect(screen.getByTestId("tools-paginated")).toHaveTextContent("true"),
);
await user.click(screen.getByText("refresh-tools"));
await user.click(screen.getByText("load-more-tools"));
await settleRejections();
expect(rejections.seen).toEqual([]);
} finally {
rejections.stop();
}
});
it("toasts a set-log-level failure instead of leaking it", async () => {
const rejections = captureUnhandledRejections();
try {
const user = await connect();
// Single assertion: the fake client IS an EventTarget, so narrowing it
// to that intersection needs no `as unknown as` detour.
const client = clientInstances[0] as EventTarget & {
setLoggingLevel: ReturnType<typeof vi.fn>;
};
client.setLoggingLevel.mockRejectedValueOnce(new Error("no logging"));
await user.click(screen.getByText("set-level"));
await waitFor(() =>
expect(notificationsMock.show).toHaveBeenCalledWith(
expect.objectContaining({
title: "Failed to set log level",
message: "no logging",
color: "red",
}),
),
);
await settleRejections();
expect(rejections.seen).toEqual([]);
} finally {
rejections.stop();
}
});
});

139
clients/web/src/App.tsx
View file

@ -2066,6 +2066,46 @@ function App() {
[inspectorClient, activeServerId, handleCommandScopedAuthRecovery],
);
/**
* Fire-and-forget form of {@link runWithCommandAuthRecovery}, for a command
* whose caller has nothing to await (a click handler, a mode toggle).
*
* The wrapper rethrows anything that is not an `AuthRecoveryRequiredError`,
* so a bare `void runWithCommandAuthRecovery(...)` turns every non-auth
* failure — a transport error, a rejected `tools/list` — into an unhandled
* rejection in the browser (#2049). Routing every background command through
* here is what keeps a new call site from reintroducing that gap by
* omission: there is no `void` to forget.
*
* `errorTitle` picks the reporting, and the choice is per call site:
*
* - **Omit it** when the operation's own state already renders the failure —
* the list loads, whose managed/paged stores record the error and whose
* panel shows it with a Retry. A toast there would only duplicate what the
* user is already looking at, so the rejection is swallowed deliberately.
* - **Pass one** when nothing else records the failure, and the user would
* otherwise see the command silently do nothing.
*/
const runCommandInBackground = useCallback(
(
operation: () => Promise<unknown>,
source: StepUpSource,
errorTitle?: string,
): void => {
void runWithCommandAuthRecovery(operation, source).catch(
(err: unknown) => {
if (!errorTitle) return;
notifications.show({
title: errorTitle,
message: err instanceof Error ? err.message : String(err),
color: "red",
});
},
);
},
[runWithCommandAuthRecovery],
);
const resumePendingReauth = useCallback(
async (pending: PendingReauth) => {
if (reauthResumeInProgressRef.current) {
@ -3474,12 +3514,16 @@ function App() {
(level: LoggingLevel) => {
setCurrentLogLevel(level);
if (!inspectorClient) return;
void runWithCommandAuthRecovery(
// Nothing else records a `logging/setLevel` failure, and the optimistic
// level above already moved — so report it, or the selector would sit on
// a level the server never accepted with no explanation.
runCommandInBackground(
() => inspectorClient.setLoggingLevel(level),
"ambient",
"Failed to set log level",
);
},
[inspectorClient, runWithCommandAuthRecovery],
[inspectorClient, runCommandInBackground],
);
// Modern era (#1629): no request is sent — the client stores the level and
@ -3502,51 +3546,39 @@ function App() {
// (the managed state lit it on `list_changed`; nothing else clears it in
// paginated mode) (#1721).
clearToolsListChanged();
void runWithCommandAuthRecovery(
() => toolsPagination.onRefresh(),
"ambient",
);
runCommandInBackground(() => toolsPagination.onRefresh(), "ambient");
} else {
void runWithCommandAuthRecovery(() => refreshTools(), "ambient");
runCommandInBackground(() => refreshTools(), "ambient");
}
}, [
paginatedLists,
toolsPagination,
refreshTools,
clearToolsListChanged,
runWithCommandAuthRecovery,
runCommandInBackground,
]);
const onRefreshPrompts = useCallback(() => {
if (paginatedLists) {
clearPromptsListChanged();
void runWithCommandAuthRecovery(
() => promptsPagination.onRefresh(),
"ambient",
);
runCommandInBackground(() => promptsPagination.onRefresh(), "ambient");
} else {
void runWithCommandAuthRecovery(() => refreshPrompts(), "ambient");
runCommandInBackground(() => refreshPrompts(), "ambient");
}
}, [
paginatedLists,
promptsPagination,
refreshPrompts,
clearPromptsListChanged,
runWithCommandAuthRecovery,
runCommandInBackground,
]);
const onRefreshResources = useCallback(() => {
if (paginatedLists) {
clearResourcesListChanged();
void runWithCommandAuthRecovery(
() => resourcesPagination.onRefresh(),
"ambient",
);
runCommandInBackground(() => resourcesPagination.onRefresh(), "ambient");
// Resource templates always use the managed (aggregate) path.
void runWithCommandAuthRecovery(
() => refreshResourceTemplates(),
"ambient",
);
runCommandInBackground(() => refreshResourceTemplates(), "ambient");
} else {
void runWithCommandAuthRecovery(async () => {
runCommandInBackground(async () => {
await refreshResources();
await refreshResourceTemplates();
}, "ambient");
@ -3557,7 +3589,7 @@ function App() {
refreshResources,
refreshResourceTemplates,
clearResourcesListChanged,
runWithCommandAuthRecovery,
runCommandInBackground,
]);
// The per-list sidebar toggle edits the server-wide `paginatedLists` setting:
// optimistic override for an instant flip, live push so the managed state's
@ -3581,22 +3613,13 @@ function App() {
// Wrap in ambient auth recovery so a mid-session 401 triggers re-auth
// rather than surfacing raw, matching the all-pages refresh path.
if (value) {
void runWithCommandAuthRecovery(
() => loadToolsPage(undefined),
"ambient",
);
void runWithCommandAuthRecovery(
() => loadPromptsPage(undefined),
"ambient",
);
void runWithCommandAuthRecovery(
() => loadResourcesPage(undefined),
"ambient",
);
runCommandInBackground(() => loadToolsPage(undefined), "ambient");
runCommandInBackground(() => loadPromptsPage(undefined), "ambient");
runCommandInBackground(() => loadResourcesPage(undefined), "ambient");
} else {
void runWithCommandAuthRecovery(() => refreshTools(), "ambient");
void runWithCommandAuthRecovery(() => refreshPrompts(), "ambient");
void runWithCommandAuthRecovery(() => refreshResources(), "ambient");
runCommandInBackground(() => refreshTools(), "ambient");
runCommandInBackground(() => refreshPrompts(), "ambient");
runCommandInBackground(() => refreshResources(), "ambient");
}
}
void updateServerSettings(activeServerId, next).catch((err: unknown) => {
@ -3625,34 +3648,24 @@ function App() {
refreshTools,
refreshPrompts,
refreshResources,
runWithCommandAuthRecovery,
runCommandInBackground,
],
);
// Wrap Load-next-page in ambient auth recovery too, so a paginated
// paginated fetch that hits a 401 recovers like the all-pages path (#1721).
const onLoadMoreTools = useCallback(
() =>
void runWithCommandAuthRecovery(
() => toolsPagination.onLoadMore(),
"ambient",
),
[toolsPagination, runWithCommandAuthRecovery],
() => runCommandInBackground(() => toolsPagination.onLoadMore(), "ambient"),
[toolsPagination, runCommandInBackground],
);
const onLoadMorePrompts = useCallback(
() =>
void runWithCommandAuthRecovery(
() => promptsPagination.onLoadMore(),
"ambient",
),
[promptsPagination, runWithCommandAuthRecovery],
runCommandInBackground(() => promptsPagination.onLoadMore(), "ambient"),
[promptsPagination, runCommandInBackground],
);
const onLoadMoreResources = useCallback(
() =>
void runWithCommandAuthRecovery(
() => resourcesPagination.onLoadMore(),
"ambient",
),
[resourcesPagination, runWithCommandAuthRecovery],
runCommandInBackground(() => resourcesPagination.onLoadMore(), "ambient"),
[resourcesPagination, runCommandInBackground],
);
const toolsPaginationControls: ListPaginationControlsProps = {
paginated: toolsPagination.paginated,
@ -3676,16 +3689,12 @@ function App() {
onLoadMore: onLoadMoreResources,
};
const onRefreshTasks = useCallback(() => {
void runWithCommandAuthRecovery(() => refreshTasks(), "ambient")?.catch(
(err: unknown) => {
notifications.show({
title: "Failed to refresh tasks",
message: err instanceof Error ? err.message : String(err),
color: "red",
});
},
runCommandInBackground(
() => refreshTasks(),
"ambient",
"Failed to refresh tasks",
);
}, [refreshTasks, runWithCommandAuthRecovery]);
}, [refreshTasks, runCommandInBackground]);
const onClearLogs = useCallback(() => {
if (!messageLogState) return;