MoCI/test.html at dev · HudsonGraeme/MoCI · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>MoCI - Manual Tests</title>
	<style>
		body {
			font-family: system-ui, sans-serif;
			max-width: 800px;
			margin: 40px auto;
			padding: 20px;
			background: #f5f5f5;
		}
		h1 { color: #333; }
		.test {
			background: white;
			padding: 20px;
			margin: 16px 0;
			border-radius: 8px;
			border-left: 4px solid #4CAF50;
		}
		.test h3 { margin-top: 0; }
		code {
			background: #f0f0f0;
			padding: 2px 6px;
			border-radius: 3px;
			font-family: monospace;
		}
		ul { margin: 12px 0; }
		li { margin: 8px 0; }
	</style>
</head>
<body>
	<h1>MoCI - Manual Test Checklist</h1>
	<p>Run these tests after deploying to verify functionality:</p>

	<div class="test">
		<h3>Authentication</h3>
		<ul>
			<li>Navigate to <code>http://router-ip/moci/</code></li>
			<li>Login form should appear with WiFi icon logo</li>
			<li>Enter credentials and click LOGIN</li>
			<li>Should redirect to dashboard on success</li>
			<li>Invalid credentials should show error message</li>
		</ul>
	</div>

	<div class="test">
		<h3>Dashboard</h3>
		<ul>
			<li>System stats should load (hostname, uptime, memory, load)</li>
			<li>Memory progress bar should display</li>
			<li>Load average graph should render (SVG)</li>
			<li>CPU, network RX/TX stats should update</li>
			<li>Stats should auto-refresh every 5 seconds</li>
			<li>Quick action buttons (REBOOT, etc.) should be visible</li>
		</ul>
	</div>

	<div class="test">
		<h3>Network - Interfaces</h3>
		<ul>
			<li>Click NETWORK INTERFACES tab</li>
			<li>Interface table should load with LAN, loopback, etc.</li>
			<li>Click "Configure" on an interface</li>
			<li>Modal should open with current settings</li>
			<li>Switch protocol between Static/DHCP</li>
			<li>Static fields should show/hide appropriately</li>
			<li>Cancel/close should dismiss modal</li>
		</ul>
	</div>

	<div class="test">
		<h3>Network - Diagnostics</h3>
		<ul>
			<li>Click DIAGNOSTICS tab</li>
			<li>Enter <code>8.8.8.8</code> in ping field</li>
			<li>Click RUN PING</li>
			<li>Should show ping results with response times</li>
			<li>Try traceroute with a hostname</li>
			<li>Should display hop-by-hop route</li>
		</ul>
	</div>

	<div class="test">
		<h3>Network - DHCP</h3>
		<ul>
			<li>Click DHCP tab</li>
			<li>Active leases table should populate</li>
			<li>Should show hostname, IP, MAC, expiry</li>
			<li>If no leases, should show "No active leases"</li>
		</ul>
	</div>

	<div class="test">
		<h3>System Settings</h3>
		<ul>
			<li>Click SYSTEM GENERAL</li>
			<li>Hostname field should be pre-populated</li>
			<li>Timezone field should show current value</li>
			<li>Click ADMINISTRATION tab</li>
			<li>Password change form should be visible</li>
		</ul>
	</div>

	<div class="test">
		<h3>UI/UX</h3>
		<ul>
			<li>Dark theme with glassmorphic cards</li>
			<li>Monospace font for data values</li>
			<li>Smooth tab transitions and animations</li>
			<li>Modal backdrop blur effect</li>
			<li>Toast notifications appear/disappear smoothly</li>
			<li>Responsive on mobile devices</li>
		</ul>
	</div>

	<div class="test">
		<h3>Session & Security</h3>
		<ul>
			<li>Session persists on page reload</li>
			<li>Logout button clears session</li>
			<li>After logout, redirects to login page</li>
			<li>Expired session shows login page</li>
			<li>No XSS vulnerabilities (input is escaped)</li>
		</ul>
	</div>

	<div class="test">
		<h3>Performance</h3>
		<ul>
			<li>Page loads in under 1 second on router</li>
			<li>No console errors in browser DevTools</li>
			<li>Network tab shows all resources load successfully</li>
			<li>Polling stops when tab is hidden</li>
			<li>Minimal memory usage (check Task Manager)</li>
		</ul>
	</div>

	<p style="margin-top: 40px; color: #666;">
		<strong>Note:</strong> This is a manual test checklist. For automated tests, consider adding
		Playwright or Cypress tests in the future.
	</p>
</body>
</html>