feat: add authentication test page and API testing scripts; implement debug auth endpoint and enhance task route with read permissions

This commit is contained in:
2025-06-25 12:54:37 +02:00
parent c1bb4c44fd
commit 1524e1e9bb
6 changed files with 520 additions and 17 deletions

142
public/test-auth.html Normal file
View File

@@ -0,0 +1,142 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Authentication Test Page</title>
<style>
body { font-family: Arial, sans-serif; margin: 20px; }
.test-section { margin: 20px 0; padding: 20px; border: 1px solid #ccc; border-radius: 5px; }
.result { margin: 10px 0; padding: 10px; border-radius: 3px; }
.success { background-color: #d4edda; border: 1px solid #c3e6cb; color: #155724; }
.error { background-color: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; }
.info { background-color: #d1ecf1; border: 1px solid #bee5eb; color: #0c5460; }
button { padding: 10px 20px; margin: 5px; cursor: pointer; }
pre { background: #f8f9fa; padding: 10px; border-radius: 3px; overflow-x: auto; }
</style>
</head>
<body>
<h1>Authentication & API Test Page</h1>
<div class="test-section">
<h2>Authentication Status</h2>
<button onclick="checkAuthStatus()">Check Authentication Status</button>
<div id="authStatus"></div>
</div>
<div class="test-section">
<h2>API Endpoint Tests</h2>
<button onclick="testAllEndpoints()">Test All API Endpoints</button>
<div id="apiResults"></div>
</div>
<div class="test-section">
<h2>Manual Login Instructions</h2>
<div class="info">
<p><strong>Test Credentials:</strong></p>
<p>Email: <code>admin@localhost.com</code></p>
<p>Password: <code>admin123456</code></p>
<p><a href="/auth/signin" target="_blank">Open Sign-in Page</a></p>
</div>
</div>
<script>
async function checkAuthStatus() {
const statusDiv = document.getElementById('authStatus');
statusDiv.innerHTML = '<div class="info">Checking authentication status...</div>';
try {
const response = await fetch('/api/auth/session');
const session = await response.json();
if (session && session.user) {
statusDiv.innerHTML = `
<div class="success">
<h3>✅ Authenticated</h3>
<pre>${JSON.stringify(session, null, 2)}</pre>
</div>
`;
} else {
statusDiv.innerHTML = `
<div class="error">
<h3>❌ Not Authenticated</h3>
<p>Please <a href="/auth/signin">sign in</a> first.</p>
</div>
`;
}
} catch (error) {
statusDiv.innerHTML = `
<div class="error">
<h3>❌ Error checking authentication</h3>
<p>${error.message}</p>
</div>
`;
}
}
async function testAllEndpoints() {
const resultsDiv = document.getElementById('apiResults');
resultsDiv.innerHTML = '<div class="info">Testing API endpoints...</div>';
const endpoints = [
{ url: '/api/debug-auth', method: 'GET', name: 'Debug Auth' },
{ url: '/api/projects', method: 'GET', name: 'Projects' },
{ url: '/api/contracts', method: 'GET', name: 'Contracts' },
{ url: '/api/tasks', method: 'GET', name: 'Tasks' },
{ url: '/api/tasks/templates', method: 'GET', name: 'Task Templates' },
{ url: '/api/project-tasks', method: 'GET', name: 'Project Tasks' }
];
let results = '';
for (const endpoint of endpoints) {
try {
const response = await fetch(endpoint.url, {
method: endpoint.method,
headers: {
'Content-Type': 'application/json'
}
});
if (response.ok) {
const data = await response.json();
const count = Array.isArray(data) ? data.length : 'object';
results += `
<div class="success">
<strong>✅ ${endpoint.name}</strong> (${endpoint.method} ${endpoint.url})
<br>Status: ${response.status} | Data: ${count} items
</div>
`;
} else if (response.status === 401) {
results += `
<div class="error">
<strong>🔒 ${endpoint.name}</strong> (${endpoint.method} ${endpoint.url})
<br>Status: ${response.status} - Unauthorized (Please sign in)
</div>
`;
} else {
results += `
<div class="error">
<strong>❌ ${endpoint.name}</strong> (${endpoint.method} ${endpoint.url})
<br>Status: ${response.status} - ${response.statusText}
</div>
`;
}
} catch (error) {
results += `
<div class="error">
<strong>💥 ${endpoint.name}</strong> (${endpoint.method} ${endpoint.url})
<br>Error: ${error.message}
</div>
`;
}
}
resultsDiv.innerHTML = results;
}
// Auto-check authentication status on page load
window.addEventListener('load', checkAuthStatus);
</script>
</body>
</html>