docs(spa): add issue-200 host-player phase sync artifact
All checks were successful
CI / test-and-quality (push) Successful in 2m43s
CI / test-and-quality (pull_request) Successful in 2m46s

This commit is contained in:
2026-03-01 19:45:13 +00:00
parent 377722eb9a
commit 63ac0d38e1

View File

@@ -0,0 +1,58 @@
# Issue #200 Artifact — SPA host→player phase sync (no reload)
## Scope
Acceptance for `[READY][SPA][P14] Gameplay MVP-del 5`:
1. Host handlinger (`start round` / `næste fase`) propagere korrekt til player-ruter i SPA.
2. Happy-path artefakt for én fuld faseovergang uden page reload.
3. Sync-fejl giver kontrolleret fallback/error state.
Afgrænsning overholdt: ingen nye spilregler og ingen redesign af backend event-model.
## Happy-path faseovergang (uden page reload)
Reference-flow i Angular shell:
1. **Host starter runde/fase**
- Host action kalder backend endpoint (`POST /lobby/sessions/:code/start` eller fase-endpoint)
- Host shell hydrerer session igen (`GET /lobby/sessions/:code`)
- Host route synkes via hash-rewrite i samme SPA shell:
- `#/host/<phase>/<CODE>`
- Implementeret i `HostShellComponent.syncRouteFromSession()`
2. **Player modtager ny fase via state sync**
- Player shell kører periodisk session-refresh (3s), uden hard reload
- Når `session.status` ændrer sig, synkes hash-route i samme SPA shell:
- `#/player/<phase>/<CODE>`
- Implementeret i `PlayerShellComponent.syncRouteFromSession()`
3. **Ingen page reload**
- Routing sker med `window.history.replaceState(...)`
- URL opdateres i eksisterende SPA instans (ingen template-hop, ingen full refresh)
## Kontrolleret fallback ved sync-fejl
Når player-sync fejler (netværk/fetch/session-refresh):
- UI går i kontrolleret connection-state:
- `reconnecting` ved online netværksfejl
- `offline` når browser rapporterer offline
- Fejl vises med retry/back-to-join handlinger
- Reconnect forsøges igen via timer (`scheduleReconnect`) uden at crashe shell
## Verifikation (tests)
Kørt i `frontend/angular` med Vitest:
- `src/app/features/host/host-shell.component.spec.ts`
- Verificerer host-faseflow og hash-route sync uden reload
- `src/app/features/player/player-shell.component.spec.ts`
- Verificerer periodisk player state sync + hash-route sync
- Verificerer reconnect/offline fallback ved sync-fejl
- `src/app/api-contract-smoke.spec.ts`
- `src/app/session-route-context.spec.ts`
- `src/app/lobby-i18n.spec.ts`
Kommando:
```bash
npm test -- --reporter=dot
```
Resultat: **5/5 testfiler grønne, 24/24 tests bestået**.