mARTin
c82572935c
- Add dark mode color adjustment helper for category colors - Support multiple motivational quote source URLs - Fix text wrapping for tasks/events to prevent horizontal overflow - Improve someday list item layout for long text - Add CLAUDE.md with semantic versioning and git workflow rules - Update test/doc URLs and planning docs v1.1.0 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
88 lines
3.3 KiB
JavaScript
88 lines
3.3 KiB
JavaScript
// Debug script to inspect login page structure and Tailwind CSS
|
|
// Run this by visiting http://localhost:3001/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:3001/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 ==='); |