My-Weekly-ToDo-List/debug-login-page.js
mARTin d92a8c7210 feat: add task actions (notes/delete) and refine animation logic
- Added 'onDelete' and 'onNotes' support to TaskItem.
- Implemented hover actions (Delete and Notes icons) for tasks.
- Added Notes Modal for editing task markdown content.
- Simplified navigation animation to remove blank flash (single-phase slide-in).
- Fixed syntax error in updateTask function.
- Updated styles for modal and task actions.
2026-02-01 12:25:53 +01:00

88 lines
3.3 KiB
JavaScript

// Debug script to inspect login page structure and Tailwind CSS
// Run this by visiting http://localhost:3000/auth/login in a browser and using DevTools
console.log('=== DEBUGGING LOGIN PAGE STRUCTURE ===');
// This will be run in browser console after navigating to http://localhost:3000/auth/login
// 1. Check if page loads properly
console.log('1. Checking page load...');
console.log('Page title:', document.title);
// 2. Check main container elements
console.log('\n2. Checking main containers:');
const mainDivs = document.querySelectorAll('div');
console.log('Total divs found:', mainDivs.length);
// Find key containers
const body = document.body;
console.log('Body class attribute:', body.className);
// 3. Check for login-specific elements
console.log('\n3. Checking login elements:');
const h1Elements = document.querySelectorAll('h1');
console.log('H1 elements count:', h1Elements.length);
h1Elements.forEach((el, i) => {
console.log(` H1 ${i+1}: "${el.textContent}"`);
});
// 4. Check for form elements
console.log('\n4. Checking form structure:');
const forms = document.querySelectorAll('form');
console.log('Forms found:', forms.length);
// 5. Check for Tailwind classes in key areas
console.log('\n5. Checking for Tailwind classes in main container:');
const mainContainer = document.querySelector('div.min-h-screen.bg-gray-50');
if (mainContainer) {
console.log('✓ Main container with Tailwind classes found');
console.log('Main container classes:', mainContainer.className);
} else {
console.log('✗ Main container not found with exact classes');
}
console.log('\n6. Looking for form container:');
const formContainer = document.querySelector('div.bg-white.rounded-xl.shadow-lg.p-8');
if (formContainer) {
console.log('✓ Form container found with Tailwind classes');
console.log('Form container classes:', formContainer.className);
} else {
console.log('✗ Form container not found with exact classes');
// Try to find similar containers
const containers = document.querySelectorAll('div.bg-white');
console.log('Containers with bg-white class:', containers.length);
}
// 7. Check for inputs and buttons
console.log('\n7. Checking form elements:');
const inputs = document.querySelectorAll('input');
console.log('Inputs found:', inputs.length);
inputs.forEach((input, i) => {
if (input.type === 'email' || input.type === 'password') {
console.log(` Input ${i+1}: type=${input.type}, name=${input.name}`);
console.log(` Classes: ${input.className}`);
}
});
const buttons = document.querySelectorAll('button');
console.log('Buttons found:', buttons.length);
buttons.forEach((btn, i) => {
console.log(` Button ${i+1}: type=${btn.type}, text="${btn.textContent.substring(0, 30)}..."`);
});
// 8. Check for expected text content
console.log('\n8. Checking for expected text:');
const paragraphs = document.querySelectorAll('p');
console.log('Paragraphs found:', paragraphs.length);
paragraphs.forEach((p, i) => {
const text = p.textContent.trim();
if (text.includes('Sign in to your account')) {
console.log('✓ Found "Sign in to your account" paragraph');
}
if (text.includes('Welcome back! Please enter your details')) {
console.log('✓ Found "Welcome back! Please enter your details" paragraph');
}
});
console.log('\n=== DEBUG COMPLETE ===');