Files
dance-lessons-coach/frontend/components/HealthDashboard.vue
Gabriel Radureau 262c4cfaed
Some checks failed
CI/CD Pipeline / Build Docker Cache (push) Successful in 9s
CI/CD Pipeline / CI Pipeline (push) Failing after 7m24s
CI/CD Pipeline / Trigger Docker Push (push) Has been skipped
🐛 fix(frontend): apply server:false + route.fulfill to health spec
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.
2026-05-05 09:04:28 +02:00

18 lines
780 B
Vue

<script setup lang="ts">
import HealthDashboardView, { type HealthInfo } from './HealthDashboardView.vue'
// Wrapper: handles data fetching, delegates rendering to HealthDashboardView.
// Separation of concerns (SRP):
// - HealthDashboard (this) = data layer (useFetch lifecycle)
// - HealthDashboardView = presentation layer (testable in Storybook + e2e)
//
// 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>
<HealthDashboardView :data="data" :pending="pending" :error="error" />
</template>