Align Quick OAuth Flow and Simple Connect Flow with Guided OAuth Flow behavior

client/src/lib/auth.ts

@@ -102,10 +102,15 @@ export const clearClientInformationFromSessionStorage = ({
 };
 
 export class InspectorOAuthClientProvider implements OAuthClientProvider {
-  constructor(protected serverUrl: string) {
+  constructor(
+    protected serverUrl: string,
+    scope?: string,
+  ) {
+    this.scope = scope;
     // Save the server URL to session storage
     sessionStorage.setItem(SESSION_KEYS.SERVER_URL, serverUrl);
   }
+  scope: string | undefined;
 
   get redirectUrl() {
     return window.location.origin + "/oauth/callback";
@@ -119,6 +124,7 @@ export class InspectorOAuthClientProvider implements OAuthClientProvider {
       response_types: ["code"],
       client_name: "MCP Inspector",
       client_uri: "https://github.com/modelcontextprotocol/inspector",
+      scope: this.scope ?? "",
     };
   }
 

client/src/lib/hooks/useConnection.ts

@@ -319,8 +319,6 @@ export function useConnection({
 
   const handleAuthError = async (error: unknown) => {
     if (is401Error(error)) {
-      const serverAuthProvider = new InspectorOAuthClientProvider(sseUrl);
-
       let scope = oauthScope?.trim();
       if (!scope) {
         // Only discover resource metadata when we need to discover scopes
@@ -334,6 +332,10 @@ export function useConnection({
         }
         scope = await discoverScopes(sseUrl, resourceMetadata);
       }
+      const serverAuthProvider = new InspectorOAuthClientProvider(
+        sseUrl,
+        scope,
+      );
 
       const result = await auth(serverAuthProvider, {
         serverUrl: sseUrl,

client/src/lib/oauth-state-machine.ts

@@ -177,7 +177,11 @@ export const oauthTransitions: Record<OAuthStep, StateTransition> = {
         authorizationCode: context.state.authorizationCode,
         codeVerifier,
         redirectUri: context.provider.redirectUrl,
-        resource: context.state.resource ?? undefined,
+        resource: context.state.resource
+          ? context.state.resource instanceof URL
+            ? context.state.resource
+            : new URL(context.state.resource)
+          : undefined,
       });
 
       context.provider.saveTokens(tokens);