akanealw/Charon
1
0
Fork 0
Code Issues Pull Requests Actions 14 Packages Projects Releases Wiki Activity

chore: implement Phase 5 E2E tests for Tasks & Monitoring

Browse Source 
Phase 5 adds comprehensive E2E test coverage for backup management,
log viewing, import wizards, and uptime monitoring features.

Backend Changes:

Add POST /api/v1/uptime/monitors endpoint for creating monitors
Add CreateMonitor service method with URL validation
Add 9 unit tests for uptime handler create functionality
Frontend Changes:

Add CreateMonitorModal component to Uptime.tsx
Add "Add Monitor" and "Sync with Hosts" buttons
Add createMonitor() API function to uptime.ts
Add data-testid attributes to 6 frontend components:
Backups.tsx, Uptime.tsx, LiveLogViewer.tsx
Logs.tsx, ImportCaddy.tsx, ImportCrowdSec.tsx
E2E Test Files Created (7 files, ~115 tests):

backups-create.spec.ts (17 tests)
backups-restore.spec.ts (8 tests)
logs-viewing.spec.ts (20 tests)
import-caddyfile.spec.ts (20 tests)
import-crowdsec.spec.ts (8 tests)
uptime-monitoring.spec.ts (22 tests)
real-time-logs.spec.ts (20 tests)
Coverage: Backend 87.0%, Frontend 85.2%
This commit is contained in:
GitHub Actions
2026-01-20 15:41:38 +00:00
parent 3c3a2dddb2
commit edb713547f
24 changed files with 8481 additions and 1250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/src/components/LiveLogViewer.tsx
View File

@@ -322,18 +322,19 @@ export function LiveLogViewer({
className={`inline-flex items-center px-2 py-0.5 rounded text-xs font-medium ${
isConnected ? 'bg-green-900 text-green-300' : 'bg-red-900 text-red-300'
}`}
data-testid="connection-status"
>
{isConnected ? 'Connected' : 'Disconnected'}
</span>
{connectionError && (
<div className="text-xs text-red-400 bg-red-900/20 px-2 py-1 rounded">
<div className="text-xs text-red-400 bg-red-900/20 px-2 py-1 rounded" data-testid="connection-error">
{connectionError}
</div>
)}
</div>
<div className="flex items-center gap-2">
{/* Mode toggle */}
<div className="flex bg-gray-800 rounded-md p-0.5">
<div className="flex bg-gray-800 rounded-md p-0.5" data-testid="mode-toggle">
<button
onClick={() => handleModeChange('application')}
className={`px-2 py-1 text-xs rounded flex items-center gap-1 transition-colors ${
@@ -444,6 +445,7 @@ export function LiveLogViewer({
<div
key={index}
className={`mb-1 hover:bg-gray-900 px-1 -mx-1 rounded ${getEntryStyle(log)}`}
data-testid="log-entry"
>
<span className="text-gray-500">{formatTimestamp(log.timestamp)}</span>
@@ -504,7 +506,7 @@ export function LiveLogViewer({
</div>
{/* Footer with log count */}
<div className="p-2 border-t border-gray-700 bg-gray-800 text-xs text-gray-400 flex items-center justify-between">
<div className="p-2 border-t border-gray-700 bg-gray-800 text-xs text-gray-400 flex items-center justify-between" data-testid="log-count">
<span>
Showing {filteredLogs.length} of {logs.length} logs
</span>