{"record":{"id":"ff639d75a451c7fa","repo":"ankane/pghero","slug":"response-statustext","errorCode":null,"errorMessage":"response.statusText","messagePattern":"response\\.statusText","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"app/assets/javascripts/pghero/application.js","lineNumber":138,"sourceCode":"    const showAll = document.getElementById(\"show-all\");\n    if (showAll) {\n      const showAllParams = Object.assign({}, params);\n      delete showAllParams.user;\n      showAll.setAttribute(\"href\", queriesPath(showAllParams));\n    }\n\n    for (const link of document.querySelectorAll(\".queries-table th a\")) {\n      const linkParams = Object.assign({}, params, {sort: link.getAttribute(\"data-sort\")});\n      link.setAttribute(\"href\", queriesPath(linkParams));\n    }\n\n    const queries = document.getElementById(\"queries\");\n    queries.innerHTML = '<tr><td colspan=\"3\"><p class=\"queries-info text-muted\">...</p></td></tr>';\n    const path = queriesPath(params);\n    fetch(path, {headers: {\"X-Requested-With\": \"XMLHttpRequest\"}})\n      .then(function (response) {\n        if (!response.ok) {\n          throw new Error(response.statusText);\n        }\n        return response.text();\n      })\n      .then(function (text) {\n        queries.innerHTML = text;\n        highlightQueries();\n      })\n      .catch(function (error) {\n        const queriesInfo = document.querySelector(\".queries-info\");\n        queriesInfo.style.color = \"red\";\n        queriesInfo.textContent = error.message;\n      });\n\n    if (push && history.pushState) {\n      history.pushState(null, null, path);\n    }\n  }\n","sourceCodeStart":120,"sourceCodeEnd":156,"githubUrl":"https://github.com/ankane/pghero/blob/7edb57986ffd36f9d64f0830c4ccc90a5eac46d6/app/assets/javascripts/pghero/application.js#L120-L156","documentation":"PgHero's queries page refreshes stats with fetch() to the /pghero/queries path (XHR header X-Requested-With: XMLHttpRequest). When the server answers with a non-2xx status, response.ok is false and the code throws new Error(response.statusText); the .catch handler paints that message in red inside the .queries-info element. So the visible text is the HTTP status phrase (e.g. \"Internal Server Error\", \"Unauthorized\") of the failed backend request, not a JavaScript bug.","triggerScenarios":"Changing any filter on the queries page (time range via the noUiSlider, sort links, user, min_average_time/min_calls) calls refreshStats -> fetch(queriesPath(params)). A 500 is returned when Rails raises on that request, most commonly PgHero::NotEnabled \"Query stats not enabled\" (pg_stat_statements missing) or a PgHero::Error from a bad database url in config/pghero.yml. A 401/403 is returned when PgHero HTTP auth (username/password) rejects the request; 502/504 when a proxy in front cannot reach the Rails app.","commonSituations":"Fresh pghero install where pg_stat_statements is not installed and the user opens the Queries tab; misconfigured config/pghero.yml (empty or wrong url); session expired behind PgHero.username/password basic auth; reverse proxy or tunnel down while the dashboard stays open.","solutions":["Open the browser Network tab, find the failing queries request, and read the response body - it contains the real Rails error (e.g. \"Query stats not enabled\")","Fix the server-side cause: for query stats, run PgHero.databases[\"primary\"].enable_query_stats (requires pg_stat_statements in shared_preload_libraries); for connection errors, fix the url in config/pghero.yml","If the status is 401/403, verify PGHERO_USERNAME/PGHERO_PASSWORD or the username/password keys in pghero.yml and that the browser is authenticated","If the status is 502/504, check that the Rails app process and any reverse proxy in front of it are up"],"exampleFix":"// before\nif (!response.ok) {\n  throw new Error(response.statusText);\n}\n\n// after - surface status plus the server error body\nif (!response.ok) {\n  const body = await response.text();\n  throw new Error(response.status + \" \" + response.statusText + \": \" + body);\n}","handlingStrategy":"try-catch","validationCode":null,"typeGuard":null,"tryCatchPattern":"fetch(path, {headers: {\"X-Requested-With\": \"XMLHttpRequest\"}})\n  .then(function (response) {\n    if (!response.ok) {\n      return response.text().then(function (body) {\n        throw new Error(response.status + \" \" + response.statusText + \": \" + body);\n      });\n    }\n    return response.text();\n  })\n  .catch(function (error) {\n    // keep a .queries-info element in the DOM so the message has somewhere to render\n    console.error(\"PgHero queries fetch failed\", error);\n    showErrorMessage(error.message);\n  });","preventionTips":["Watch the Rails production log when the red message appears - the root cause is always the server-side exception, not the JS","Keep pg_stat_statements installed on every database listed in pghero.yml so the queries endpoint returns 200","If PgHero basic auth is on, make sure authenticated sessions stay valid for XHR requests"],"tags":["http","fetch","frontend","pghero-ui"],"backgroundTag":"http-request-failed","analyzedSha":"7edb57986ffd36f9d64f0830c4ccc90a5eac46d6","analyzedAt":"2026-08-21T17:33:54.942Z","schemaVersion":2},"datasetVersion":"2026-08-21T18:17:14.833Z"}