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<HealthInfo>('/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<HealthInfo>('/api/healthz', { server: false })
 </script>
 
 <template>
diff --git a/frontend/tests/e2e/health.spec.ts b/frontend/tests/e2e/health.spec.ts
index 5ed5c5f..4915e91 100644
--- a/frontend/tests/e2e/health.spec.ts
+++ b/frontend/tests/e2e/health.spec.ts
@@ -1,6 +1,24 @@
 import { test, expect } from '@playwright/test'
 
+// Both specs mock /api/healthz so they decouple from the dev-proxy plumbing.
+// The integration with the real backend is covered by the BDD scenario in
+// features/health/health.feature (server-side, no frontend proxy in the loop).
+// Same approach as tests/e2e/app-footer.spec.ts (PR #40) - applied here to
+// close the debt left by that PR's out-of-scope follow-up note.
+
 test('home page loads and shows healthy server state', async ({ page }) => {
+  await page.route('**/api/healthz', (route) => {
+    route.fulfill({
+      status: 200,
+      contentType: 'application/json',
+      body: JSON.stringify({
+        status: 'healthy',
+        version: '1.4.0',
+        uptime_seconds: 8042,
+        timestamp: '2026-05-05T08:00:00Z',
+      }),
+    })
+  })
   await page.goto('/')
   await expect(page.getByTestId('health-dashboard')).toBeVisible()
   const heading = page.getByRole('heading', { name: /dance-lessons-coach/i })
diff --git a/frontend/tests/e2e/screenshots/home-page-surfaces-health-endpoint-errors-visibly.png b/frontend/tests/e2e/screenshots/home-page-surfaces-health-endpoint-errors-visibly.png
new file mode 100644
index 0000000..5e1e938
Binary files /dev/null and b/frontend/tests/e2e/screenshots/home-page-surfaces-health-endpoint-errors-visibly.png differ