test: add E2E server-detail tests and fill coverage gaps to 83.9%

- Add Playwright E2E for all 5 UX phases (Config/Missions/Mods/Players/Logs)
  with ServerDetailPage POM and fully mocked API routes
- Add logger.test.ts: dynamic module re-import pattern for level-gating tests
- Add useUpdateServer + useKillServer tests to useServers.test.tsx
- Add CreateServerPage edge cases: non-admin gate, API error handling, step 2 render
- Add auth.store rehydration and null-branch coverage tests
- Update FRONTEND.md, MODULES.md, API.md, README.md to reflect current state
  (167 unit tests, 38 E2E tests, 9 useServers hooks, all UX phases implemented)
This commit is contained in:
Tran G. (Revernomad) Khoa
2026-04-18 10:24:03 +07:00
parent 8bac29fb68
commit b7d670a91c
10 changed files with 606 additions and 11 deletions

View File

@@ -82,6 +82,7 @@ frontend/src/
├── api.test.ts # Axios interceptor tests
├── auth.store.test.ts # Auth store tests
├── ui.store.test.ts # UI store tests
├── logger.test.ts # Logger level-filtering tests
├── StatusLed.test.tsx # StatusLed component tests
├── LoginPage.test.tsx # Login page tests
├── DashboardPage.test.tsx # Dashboard page tests
@@ -89,7 +90,11 @@ frontend/src/
├── ServerCard.handlers.test.tsx # Server card interaction tests
├── Sidebar.test.tsx # Sidebar tests
├── useWebSocket.test.tsx # WebSocket hook tests
── useServers.test.tsx # Server hooks tests
── useServers.test.tsx # Server hooks tests (useServers, useServer, lifecycle, useUpdateServer, useKillServer)
├── useServerDetail.test.tsx # Server detail hooks (config, players, bans, missions, mods, RCon, logfiles)
├── useAuth.test.tsx # Auth hooks tests
├── useGames.test.tsx # Games hooks tests
└── CreateServerPage.test.tsx # Create server wizard (steps, validation, submit, edge cases)
```
## Routes
@@ -281,13 +286,14 @@ Dark neumorphic theme defined in `tailwind.config.js`:
## Testing
### Unit Tests (149 tests, Vitest + React Testing Library)
### Unit Tests (167 tests, Vitest + React Testing Library)
| Test File | Tests | Coverage |
|---|---|---|
| `api.test.ts` | 4 | Interceptors: token header, 401 redirect (non-auth), 401 no-redirect (auth) |
| `auth.store.test.ts` | 3 | Init state, setAuth, clearAuth, localStorage sync |
| `auth.store.test.ts` | 8 | Init state, setAuth, clearAuth, localStorage sync, rehydration, partialize |
| `ui.store.test.ts` | 5 | Init state, toggleSidebar, setActiveServer, add/remove notifications |
| `logger.test.ts` | 10 | All 4 log methods, level filtering (debug/warn/error), message format |
| `StatusLed.test.tsx` | 8 | Status classes, showLabel, sizes |
| `LoginPage.test.tsx` | 4 | Form render, validation, API call, error display |
| `DashboardPage.test.tsx` | 5 | Loading/error/empty states, card rendering |
@@ -295,12 +301,13 @@ Dark neumorphic theme defined in `tailwind.config.js`:
| `ServerCard.handlers.test.tsx` | 9 | Start/stop/restart success/failure notifications |
| `Sidebar.test.tsx` | 6 | Branding, links, loading state, server list, active highlight |
| `useWebSocket.test.tsx` | 5 | No-connect without token, connect, token in URL, invalidation, cleanup |
| `useServers.test.tsx` | 10 | Server CRUD + lifecycle hooks, cache invalidation |
| `useServerDetail.test.tsx` | 20+ | Config, players, bans, missions, mods, mutations, cache invalidation |
| `useServers.test.tsx` | 12 | Server CRUD + lifecycle hooks, useUpdateServer, useKillServer |
| `useServerDetail.test.tsx` | 20+ | Config, players, bans, missions, mods, mutations, logfiles, cache invalidation |
| `useAuth.test.tsx` | 7 | Current user, users, change password, create/delete user, logout |
| `useGames.test.tsx` | 5 | Games list, detail, config schema, defaults |
| `CreateServerPage.test.tsx` | 14 | All 4 wizard steps, validation, submit, non-admin gate, API error handling |
### E2E Tests (23 tests, Playwright)
### E2E Tests (38 tests, Playwright)
**Login Flow** (6 tests):
- Display login form, branding, validation errors
@@ -315,6 +322,14 @@ Dark neumorphic theme defined in `tailwind.config.js`:
- Player count display, server detail navigation
- Empty state, error state
**Server Detail — 5 UX phases** (15 tests, fully mocked):
- Overview: server name/status, all 6 tabs visible
- Config: field labels rendered (Hostname, BattlEye)
- Missions: mission names, terrain names, Upload button
- Mods: display names, enabled/disabled state
- Players: player list, ping values, Kick buttons
- Logs: collapsible Log Files section, Download buttons, live log viewer area
**Full Stack Integration** (5 tests):
- Login + see A3Master on dashboard (real backend)
- A3Master server details in card (real backend)