From 262c4cfaedf18a8225e61a84904ee5504b7a7154 Mon Sep 17 00:00:00 2001 From: Gabriel Radureau Date: Tue, 5 May 2026 09:04:28 +0200 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix(frontend):=20apply=20server:?= =?UTF-8?q?false=20+=20route.fulfill=20to=20health=20spec?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Closes the debt left by PR #40 (api/info + footer): the existing tests/e2e/health.spec.ts happy path still hit the dev-proxy issue that PR #40 worked around for the new app-footer spec. Same fix applied to HealthDashboard.vue and the spec: - HealthDashboard.vue: useFetch( ..., { server: false }) — fetch client-side only so Playwright route mocks apply (was failing on SSR through the dev proxy). - health.spec.ts: happy path now uses page.route to mock /api/healthz with a 200 success body, matching the pattern in app-footer.spec.ts. The error scenario already used route mocking; unchanged. The integration with the real backend remains covered by the BDD scenario in features/health/health.feature (server-side, no proxy in the loop). Full Playwright suite (4 tests) now passes locally. --- frontend/components/HealthDashboard.vue | 6 +++++- frontend/tests/e2e/health.spec.ts | 18 ++++++++++++++++++ ...urfaces-health-endpoint-errors-visibly.png | Bin 0 -> 20619 bytes 3 files changed, 23 insertions(+), 1 deletion(-) create mode 100644 frontend/tests/e2e/screenshots/home-page-surfaces-health-endpoint-errors-visibly.png diff --git a/frontend/components/HealthDashboard.vue b/frontend/components/HealthDashboard.vue index 858b705..9c21892 100644 --- a/frontend/components/HealthDashboard.vue +++ b/frontend/components/HealthDashboard.vue @@ -5,7 +5,11 @@ import HealthDashboardView, { type HealthInfo } from './HealthDashboardView.vue' // Separation of concerns (SRP): // - HealthDashboard (this) = data layer (useFetch lifecycle) // - HealthDashboardView = presentation layer (testable in Storybook + e2e) -const { data, pending, error } = await useFetch('/api/healthz') +// +// server: false → fetch client-side only. Avoids SSR fetching through the dev +// proxy (which can fail in some local setups), and lets Playwright route mocks +// apply. Same fix that landed for AppFooter in PR #40. +const { data, pending, error } = useFetch('/api/healthz', { server: false })