359 lines
11 KiB
HTML
359 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>User Management API Tests</title>
|
|
<style>
|
|
body {
|
|
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
|
|
max-width: 1200px;
|
|
margin: 40px auto;
|
|
padding: 20px;
|
|
background: #f5f5f5;
|
|
}
|
|
.container {
|
|
background: white;
|
|
padding: 30px;
|
|
border-radius: 10px;
|
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
|
}
|
|
h1 {
|
|
color: #333;
|
|
border-bottom: 3px solid #667eea;
|
|
padding-bottom: 10px;
|
|
}
|
|
.test-section {
|
|
margin: 30px 0;
|
|
padding: 20px;
|
|
background: #f9f9f9;
|
|
border-left: 4px solid #667eea;
|
|
border-radius: 5px;
|
|
}
|
|
.test-section h3 {
|
|
margin-top: 0;
|
|
color: #667eea;
|
|
}
|
|
button {
|
|
background: #667eea;
|
|
color: white;
|
|
border: none;
|
|
padding: 10px 20px;
|
|
border-radius: 5px;
|
|
cursor: pointer;
|
|
font-size: 14px;
|
|
margin: 5px;
|
|
}
|
|
button:hover {
|
|
background: #5568d3;
|
|
}
|
|
.result {
|
|
margin-top: 15px;
|
|
padding: 15px;
|
|
background: white;
|
|
border: 1px solid #ddd;
|
|
border-radius: 5px;
|
|
font-family: "Courier New", monospace;
|
|
font-size: 13px;
|
|
white-space: pre-wrap;
|
|
max-height: 400px;
|
|
overflow-y: auto;
|
|
}
|
|
.success {
|
|
border-left: 4px solid #10b981;
|
|
background: #f0fdf4;
|
|
}
|
|
.error {
|
|
border-left: 4px solid #ef4444;
|
|
background: #fef2f2;
|
|
color: #dc2626;
|
|
}
|
|
.info {
|
|
background: #eff6ff;
|
|
border-left: 4px solid #3b82f6;
|
|
padding: 15px;
|
|
border-radius: 5px;
|
|
margin: 20px 0;
|
|
}
|
|
input {
|
|
padding: 8px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 4px;
|
|
margin: 5px;
|
|
width: 200px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<h1>🧪 User Management API Tests</h1>
|
|
|
|
<div class="info">
|
|
<strong>Note:</strong> You must be logged in as an admin to run these
|
|
tests. Open the browser console (F12) for detailed logs.
|
|
</div>
|
|
|
|
<!-- Test 1: List All Users -->
|
|
<div class="test-section">
|
|
<h3>1. List All Users (GET /api/admin/users)</h3>
|
|
<button onclick="testListUsers()">Run Test</button>
|
|
<div id="result1" class="result" style="display: none"></div>
|
|
</div>
|
|
|
|
<!-- Test 2: Get Single User -->
|
|
<div class="test-section">
|
|
<h3>2. Get Single User (GET /api/admin/users/:id)</h3>
|
|
<input type="text" id="getUserId" placeholder="Enter user ID" />
|
|
<button onclick="testGetUser()">Run Test</button>
|
|
<div id="result2" class="result" style="display: none"></div>
|
|
</div>
|
|
|
|
<!-- Test 3: Create New User -->
|
|
<div class="test-section">
|
|
<h3>3. Create New User (POST /api/admin/users)</h3>
|
|
<div>
|
|
<input
|
|
type="text"
|
|
id="createName"
|
|
placeholder="Name"
|
|
value="Test User"
|
|
/>
|
|
<input type="text" id="createUsername" placeholder="Username" />
|
|
<input type="email" id="createEmail" placeholder="Email" />
|
|
</div>
|
|
<div>
|
|
<input
|
|
type="password"
|
|
id="createPassword"
|
|
placeholder="Password"
|
|
value="SecurePass123"
|
|
/>
|
|
<select id="createRole" style="padding: 8px; margin: 5px">
|
|
<option value="Cashier">Cashier</option>
|
|
<option value="Accountant">Accountant</option>
|
|
<option value="Admin">Admin</option>
|
|
</select>
|
|
</div>
|
|
<button onclick="testCreateUser()">Run Test</button>
|
|
<div id="result3" class="result" style="display: none"></div>
|
|
</div>
|
|
|
|
<!-- Test 4: Update User -->
|
|
<div class="test-section">
|
|
<h3>4. Update User (PUT /api/admin/users/:id)</h3>
|
|
<input type="text" id="updateUserId" placeholder="User ID" />
|
|
<input type="text" id="updateName" placeholder="New Name" />
|
|
<select id="updateRole" style="padding: 8px; margin: 5px">
|
|
<option value="Cashier">Cashier</option>
|
|
<option value="Accountant">Accountant</option>
|
|
<option value="Admin">Admin</option>
|
|
</select>
|
|
<button onclick="testUpdateUser()">Run Test</button>
|
|
<div id="result4" class="result" style="display: none"></div>
|
|
</div>
|
|
|
|
<!-- Test 5: Change Password -->
|
|
<div class="test-section">
|
|
<h3>5. Change Password (PUT /api/admin/users/:id/password)</h3>
|
|
<input type="text" id="passwordUserId" placeholder="User ID" />
|
|
<input
|
|
type="password"
|
|
id="newPassword"
|
|
placeholder="New Password"
|
|
value="NewSecure456"
|
|
/>
|
|
<button onclick="testChangePassword()">Run Test</button>
|
|
<div id="result5" class="result" style="display: none"></div>
|
|
</div>
|
|
|
|
<!-- Test 6: Delete User -->
|
|
<div class="test-section">
|
|
<h3>6. Delete User (DELETE /api/admin/users/:id)</h3>
|
|
<input type="text" id="deleteUserId" placeholder="User ID" />
|
|
<button onclick="testDeleteUser()" style="background: #ef4444">
|
|
Run Test
|
|
</button>
|
|
<div id="result6" class="result" style="display: none"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// Generate random username/email
|
|
function generateTestCredentials() {
|
|
const timestamp = Date.now();
|
|
document.getElementById("createUsername").value =
|
|
"testuser_" + timestamp;
|
|
document.getElementById("createEmail").value =
|
|
"test_" + timestamp + "@example.com";
|
|
}
|
|
|
|
// Initialize with random credentials
|
|
generateTestCredentials();
|
|
|
|
// Helper to display results
|
|
function showResult(elementId, data, isError = false) {
|
|
const resultDiv = document.getElementById(elementId);
|
|
resultDiv.style.display = "block";
|
|
resultDiv.className = "result " + (isError ? "error" : "success");
|
|
resultDiv.textContent =
|
|
typeof data === "string" ? data : JSON.stringify(data, null, 2);
|
|
}
|
|
|
|
// Test 1: List all users
|
|
async function testListUsers() {
|
|
try {
|
|
const response = await fetch("/api/admin/users", {
|
|
credentials: "include",
|
|
});
|
|
const data = await response.json();
|
|
console.log("List Users:", data);
|
|
showResult("result1", data);
|
|
} catch (error) {
|
|
console.error("Error:", error);
|
|
showResult("result1", error.message, true);
|
|
}
|
|
}
|
|
|
|
// Test 2: Get single user
|
|
async function testGetUser() {
|
|
const userId = document.getElementById("getUserId").value;
|
|
if (!userId) {
|
|
alert("Please enter a user ID");
|
|
return;
|
|
}
|
|
try {
|
|
const response = await fetch(`/api/admin/users/${userId}`, {
|
|
credentials: "include",
|
|
});
|
|
const data = await response.json();
|
|
console.log("Get User:", data);
|
|
showResult("result2", data);
|
|
} catch (error) {
|
|
console.error("Error:", error);
|
|
showResult("result2", error.message, true);
|
|
}
|
|
}
|
|
|
|
// Test 3: Create user
|
|
async function testCreateUser() {
|
|
const userData = {
|
|
name: document.getElementById("createName").value,
|
|
username: document.getElementById("createUsername").value,
|
|
email: document.getElementById("createEmail").value,
|
|
password: document.getElementById("createPassword").value,
|
|
role: document.getElementById("createRole").value,
|
|
isactive: true,
|
|
passwordneverexpires: false,
|
|
};
|
|
|
|
try {
|
|
const response = await fetch("/api/admin/users", {
|
|
method: "POST",
|
|
headers: { "Content-Type": "application/json" },
|
|
credentials: "include",
|
|
body: JSON.stringify(userData),
|
|
});
|
|
const data = await response.json();
|
|
console.log("Create User:", data);
|
|
showResult("result3", data);
|
|
|
|
// Store the created user ID for other tests
|
|
if (data.success && data.user) {
|
|
document.getElementById("getUserId").value = data.user.id;
|
|
document.getElementById("updateUserId").value = data.user.id;
|
|
document.getElementById("passwordUserId").value = data.user.id;
|
|
document.getElementById("deleteUserId").value = data.user.id;
|
|
}
|
|
|
|
// Generate new credentials for next test
|
|
generateTestCredentials();
|
|
} catch (error) {
|
|
console.error("Error:", error);
|
|
showResult("result3", error.message, true);
|
|
}
|
|
}
|
|
|
|
// Test 4: Update user
|
|
async function testUpdateUser() {
|
|
const userId = document.getElementById("updateUserId").value;
|
|
if (!userId) {
|
|
alert("Please enter a user ID");
|
|
return;
|
|
}
|
|
|
|
const updateData = {
|
|
name: document.getElementById("updateName").value,
|
|
role: document.getElementById("updateRole").value,
|
|
};
|
|
|
|
try {
|
|
const response = await fetch(`/api/admin/users/${userId}`, {
|
|
method: "PUT",
|
|
headers: { "Content-Type": "application/json" },
|
|
credentials: "include",
|
|
body: JSON.stringify(updateData),
|
|
});
|
|
const data = await response.json();
|
|
console.log("Update User:", data);
|
|
showResult("result4", data);
|
|
} catch (error) {
|
|
console.error("Error:", error);
|
|
showResult("result4", error.message, true);
|
|
}
|
|
}
|
|
|
|
// Test 5: Change password
|
|
async function testChangePassword() {
|
|
const userId = document.getElementById("passwordUserId").value;
|
|
const password = document.getElementById("newPassword").value;
|
|
|
|
if (!userId) {
|
|
alert("Please enter a user ID");
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const response = await fetch(`/api/admin/users/${userId}/password`, {
|
|
method: "PUT",
|
|
headers: { "Content-Type": "application/json" },
|
|
credentials: "include",
|
|
body: JSON.stringify({ password: password }),
|
|
});
|
|
const data = await response.json();
|
|
console.log("Change Password:", data);
|
|
showResult("result5", data);
|
|
} catch (error) {
|
|
console.error("Error:", error);
|
|
showResult("result5", error.message, true);
|
|
}
|
|
}
|
|
|
|
// Test 6: Delete user
|
|
async function testDeleteUser() {
|
|
const userId = document.getElementById("deleteUserId").value;
|
|
if (!userId) {
|
|
alert("Please enter a user ID");
|
|
return;
|
|
}
|
|
|
|
if (!confirm("Are you sure you want to delete this user?")) {
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const response = await fetch(`/api/admin/users/${userId}`, {
|
|
method: "DELETE",
|
|
credentials: "include",
|
|
});
|
|
const data = await response.json();
|
|
console.log("Delete User:", data);
|
|
showResult("result6", data);
|
|
} catch (error) {
|
|
console.error("Error:", error);
|
|
showResult("result6", error.message, true);
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|