Updated error handling for bad requests in test gateway (#435)

* Updated error handling for bad requests & urls

Signed-off-by: Reeve Barreto <[email protected]>

* lint-web admin.js

Signed-off-by: Reeve Barreto <[email protected]>

* updated correct latency response at the endpoint

Signed-off-by: Reeve Barreto <[email protected]>

* Update throw error

Signed-off-by: Reeve Barreto <[email protected]>

* flake8

Signed-off-by: Reeve Barreto <[email protected]>

---------

Signed-off-by: Reeve Barreto <[email protected]>

Author: reevebarreto

mcpgateway/admin.py

@@ -1366,24 +1366,23 @@ async def admin_test_gateway(request: GatewayTestRequest, user: str = Depends(re
 
     Returns:
         GatewayTestResponse: The response from the gateway, including status code, latency, and body
-
-    Raises:
-        HTTPException: If the gateway request fails (e.g., connection error, timeout).
     """
     full_url = str(request.base_url).rstrip("/") + "/" + request.path.lstrip("/")
+    full_url = full_url.rstrip("/")
     logger.debug(f"User {user} testing server at {request.base_url}.")
     try:
+        start_time = time.monotonic()
         async with httpx.AsyncClient(timeout=settings.federation_timeout, verify=not settings.skip_ssl_verify) as client:
-            start_time = time.monotonic()
             response = await client.request(method=request.method.upper(), url=full_url, headers=request.headers, json=request.body)
-            latency_ms = int((time.monotonic() - start_time) * 1000)
+        latency_ms = int((time.monotonic() - start_time) * 1000)
         try:
             response_body: Union[dict, str] = response.json()
         except json.JSONDecodeError:
-            response_body = response.text
+            response_body = {"details": response.text}
 
         return GatewayTestResponse(status_code=response.status_code, latency_ms=latency_ms, body=response_body)
 
     except httpx.RequestError as e:
         logger.warning(f"Gateway test failed: {e}")
-        raise HTTPException(status_code=502, detail=f"Request failed: {str(e)}")
+        latency_ms = int((time.monotonic() - start_time) * 1000)
+        return GatewayTestResponse(status_code=502, latency_ms=latency_ms, body={"error": "Request failed", "details": str(e)})

mcpgateway/static/admin.js

@@ -3319,6 +3319,7 @@ async function handleGatewayTestSubmit(e) {
     const loading = safeGetElement("gateway-test-loading");
     const responseDiv = safeGetElement("gateway-test-response-json");
     const resultDiv = safeGetElement("gateway-test-result");
+    const testButton = safeGetElement("gateway-test-submit");
 
     try {
         // Show loading
@@ -3328,6 +3329,10 @@ async function handleGatewayTestSubmit(e) {
         if (resultDiv) {
             resultDiv.classList.add("hidden");
         }
+        if (testButton) {
+            testButton.disabled = true;
+            testButton.textContent = "Testing...";
+        }
 
         const form = e.target;
         const url = form.action;
@@ -3393,31 +3398,32 @@ async function handleGatewayTestSubmit(e) {
 
         const result = await response.json();
 
-        if (responseDiv) {
-            // Display result safely
-            responseDiv.innerHTML = `
-                <div class="alert alert-success">
-                    <h4>✅ Connection Successful</h4>
-                    <p><strong>Status Code:</strong> ${result.statusCode}</p>
-                    <p><strong>Response Time:</strong> ${result.latencyMs}ms</p>
-                    ${
-                        result.body
-                            ? `<details>
-                        <summary class='cursor-pointer'>Response Body</summary>
-                        <pre class="text-sm px-4 max-h-96 dark:bg-gray-800 dark:text-gray-100 overflow-auto">${JSON.stringify(result.body, null, 2)}</pre>
-                    </details>`
-                            : ""
-                    }
-                </div>
-            `;
-        } else {
-            responseDiv.innerHTML = `
-            <div class="alert alert-error">
-                <h4>❌ Connection Failed</h4>
-                <p>${result.error || "Unable to connect to the server"}</p>
-            </div>
+        const isSuccess =
+            result.statusCode &&
+            result.statusCode >= 200 &&
+            result.statusCode < 300;
+
+        const alertType = isSuccess ? "success" : "error";
+        const icon = isSuccess ? "✅" : "❌";
+        const title = isSuccess ? "Connection Successful" : "Connection Failed";
+        const statusCode = result.statusCode || "Unknown";
+        const latency =
+            result.latencyMs != null ? `${result.latencyMs}ms` : "NA";
+        const body = result.body
+            ? `<details open>
+                <summary class='cursor-pointer'><strong>Response Body</strong></summary>
+                <pre class="text-sm px-4 max-h-96 dark:bg-gray-800 dark:text-gray-100 overflow-auto">${JSON.stringify(result.body, null, 2)}</pre>
+            </details>`
+            : "";
+
+        responseDiv.innerHTML = `
+        <div class="alert alert-${alertType}">
+            <h4><strong>${icon} ${title}</strong></h4>
+            <p><strong>Status Code:</strong> ${statusCode}</p>
+            <p><strong>Response Time:</strong> ${latency}</p>
+            ${body}
+        </div>
         `;
-        }
     } catch (error) {
         console.error("Gateway test error:", error);
         if (responseDiv) {
@@ -3434,6 +3440,9 @@ async function handleGatewayTestSubmit(e) {
         if (resultDiv) {
             resultDiv.classList.remove("hidden");
         }
+
+        testButton.disabled = false;
+        testButton.textContent = "Test";
     }
 }
 

mcpgateway/templates/admin.html

@@ -1742,11 +1742,11 @@ <h2 class="text-xl font-bold mb-4 text-gray-800 dark:text-gray-100">Test Gateway
         <form id="gateway-test-form" class="space-y-4">
           <div>
             <label for="gateway-test-url" class="block text-sm font-medium text-gray-700">Server URL</label>
-            <input name="url" type="text" id="gateway-test-url" class="mt-1 block w-full rounded-md shadow-sm p-1" />
+            <input required name="url" type="text" id="gateway-test-url" class="mt-1 block w-full rounded-md shadow-sm p-1" />
           </div>
           <div>
             <label for="gateway-test-method" class="block text-sm font-medium text-gray-700">Method</label>
-            <select name="method" id="gateway-test-method" class="mt-1 block w-full rounded-md shadow-sm p-1">
+            <select required name="method" id="gateway-test-method" class="mt-1 block w-full rounded-md shadow-sm p-1">
               <option>GET</option>
               <option>POST</option>
               <option>PUT</option>
@@ -1772,7 +1772,7 @@ <h2 class="text-xl font-bold mb-4 text-gray-800 dark:text-gray-100">Test Gateway
           <div class="flex">
             <button type="submit" id="gateway-test-submit"
               class="w-full text-center px-3 py-1 bg-indigo-600 text-white rounded hover:bg-indigo-700">
-              Send
+              Test
             </button>
             <p class="p-1"></p>
             <button id="gateway-test-close" type="button"