Claude
commited on
fix(frontend): log JSON parse errors in API client (BUG-013)
Browse filesAdd parseErrorJson() helper that logs failed JSON parsing in development mode.
Previously, malformed JSON responses (e.g., HTML 502 pages) were silently
converted to {} with no indication of the actual error.
Now in development mode, developers will see console warnings with:
- The parse error
- Response status code and status text
- frontend/src/api/client.ts +26 -3
frontend/src/api/client.ts
CHANGED
|
@@ -4,6 +4,29 @@ import type {
|
|
| 4 |
JobStatusResponse,
|
| 5 |
} from '../types'
|
| 6 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 7 |
function getApiBase(): string {
|
| 8 |
const url = import.meta.env.VITE_API_URL
|
| 9 |
|
|
@@ -47,7 +70,7 @@ class ApiClient {
|
|
| 47 |
const response = await fetch(`${this.baseUrl}/api/cases`, { signal })
|
| 48 |
|
| 49 |
if (!response.ok) {
|
| 50 |
-
const error = await response
|
| 51 |
throw new ApiError(
|
| 52 |
`Failed to fetch cases: ${response.statusText}`,
|
| 53 |
response.status,
|
|
@@ -82,7 +105,7 @@ class ApiClient {
|
|
| 82 |
})
|
| 83 |
|
| 84 |
if (!response.ok) {
|
| 85 |
-
const error = await response
|
| 86 |
throw new ApiError(
|
| 87 |
`Failed to create job: ${error.detail || response.statusText}`,
|
| 88 |
response.status,
|
|
@@ -117,7 +140,7 @@ class ApiClient {
|
|
| 117 |
}
|
| 118 |
|
| 119 |
if (!response.ok) {
|
| 120 |
-
const error = await response
|
| 121 |
throw new ApiError(
|
| 122 |
`Failed to get job status: ${error.detail || response.statusText}`,
|
| 123 |
response.status,
|
|
|
|
| 4 |
JobStatusResponse,
|
| 5 |
} from '../types'
|
| 6 |
|
| 7 |
+
/**
|
| 8 |
+
* Safely parse JSON error response, logging failures in development.
|
| 9 |
+
* Returns empty object if parsing fails (e.g., HTML error pages from proxies).
|
| 10 |
+
* (BUG-013 fix: was silently returning {} without any logging)
|
| 11 |
+
*/
|
| 12 |
+
async function parseErrorJson(response: Response): Promise<{ detail?: string }> {
|
| 13 |
+
try {
|
| 14 |
+
return await response.json()
|
| 15 |
+
} catch (parseError) {
|
| 16 |
+
// Log in development to help debug malformed responses
|
| 17 |
+
if (import.meta.env.DEV) {
|
| 18 |
+
console.warn(
|
| 19 |
+
'Failed to parse error response as JSON:',
|
| 20 |
+
parseError,
|
| 21 |
+
'Status:',
|
| 22 |
+
response.status,
|
| 23 |
+
response.statusText
|
| 24 |
+
)
|
| 25 |
+
}
|
| 26 |
+
return {}
|
| 27 |
+
}
|
| 28 |
+
}
|
| 29 |
+
|
| 30 |
function getApiBase(): string {
|
| 31 |
const url = import.meta.env.VITE_API_URL
|
| 32 |
|
|
|
|
| 70 |
const response = await fetch(`${this.baseUrl}/api/cases`, { signal })
|
| 71 |
|
| 72 |
if (!response.ok) {
|
| 73 |
+
const error = await parseErrorJson(response)
|
| 74 |
throw new ApiError(
|
| 75 |
`Failed to fetch cases: ${response.statusText}`,
|
| 76 |
response.status,
|
|
|
|
| 105 |
})
|
| 106 |
|
| 107 |
if (!response.ok) {
|
| 108 |
+
const error = await parseErrorJson(response)
|
| 109 |
throw new ApiError(
|
| 110 |
`Failed to create job: ${error.detail || response.statusText}`,
|
| 111 |
response.status,
|
|
|
|
| 140 |
}
|
| 141 |
|
| 142 |
if (!response.ok) {
|
| 143 |
+
const error = await parseErrorJson(response)
|
| 144 |
throw new ApiError(
|
| 145 |
`Failed to get job status: ${error.detail || response.statusText}`,
|
| 146 |
response.status,
|