txeo/cv-site
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: remove old test files

Browse Source
This commit is contained in:
juanatsap
2025-11-16 14:14:20 +00:00
parent a7cc899832
commit 36965df42a
4 changed files with 0 additions and 422 deletions
Download Patch File Download Diff File Expand all files Collapse all files
test-color-swap.mjs
-126
View File
@@ -1,126 +0,0 @@
import { chromium } from '@playwright/test';
import { fileURLToPath } from 'url';
import { dirname, join } from 'path';
import fs from 'fs';
const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);
const screenshotsDir = join(__dirname, 'test-screenshots');
if (!fs.existsSync(screenshotsDir)) {
fs.mkdirSync(screenshotsDir);
}
(async () => {
const browser = await chromium.launch({ headless: false });
const context = await browser.newContext({
viewport: { width: 1920, height: 1080 }
});
const page = await context.newPage();
console.log('🎨 Testing Color Swap: Orange for Shortcuts, Blue for Zoom...\n');
await page.goto('http://localhost:1999');
await page.waitForLoadState('networkidle');
await page.waitForTimeout(1000);
// Clear storage for fresh start
await page.evaluate(() => localStorage.clear());
await page.reload();
await page.waitForLoadState('networkidle');
await page.waitForTimeout(500);
const zoomBtn = page.locator('#zoom-toggle-button');
const shortcutsBtn = page.locator('#shortcuts-button');
// Test 1: Both buttons inactive (same gray)
console.log('📸 Test 1: Both buttons inactive (same gray appearance)');
await page.screenshot({ path: join(screenshotsDir, 'color-swap-1-inactive.png') });
const zoomInactive = await zoomBtn.evaluate(el => {
const styles = window.getComputedStyle(el);
return {
background: styles.backgroundColor,
opacity: styles.opacity
};
});
const shortcutsInactive = await shortcutsBtn.evaluate(el => {
const styles = window.getComputedStyle(el);
return {
background: styles.backgroundColor,
opacity: styles.opacity
};
});
console.log(' Zoom button:', zoomInactive);
console.log(' Shortcuts button:', shortcutsInactive);
// Test 2: Hover zoom button (should turn blue)
console.log('\n📸 Test 2: Hover zoom button (should be BLUE)');
await zoomBtn.hover();
await page.waitForTimeout(300);
const zoomHover = await zoomBtn.evaluate(el => {
const styles = window.getComputedStyle(el);
return {
background: styles.backgroundColor
};
});
console.log(' Zoom hover color:', zoomHover.background);
await page.screenshot({ path: join(screenshotsDir, 'color-swap-2-zoom-hover-blue.png') });
// Test 3: Hover shortcuts button (should turn orange)
console.log('\n📸 Test 3: Hover shortcuts button (should be ORANGE)');
await shortcutsBtn.hover();
await page.waitForTimeout(300);
const shortcutsHover = await shortcutsBtn.evaluate(el => {
const styles = window.getComputedStyle(el);
return {
background: styles.backgroundColor
};
});
console.log(' Shortcuts hover color:', shortcutsHover.background);
await page.screenshot({ path: join(screenshotsDir, 'color-swap-3-shortcuts-hover-orange.png') });
// Test 4: Activate zoom (should be blue)
console.log('\n📸 Test 4: Activate zoom (should stay BLUE)');
await zoomBtn.click();
await page.waitForTimeout(500);
const zoomActive = await zoomBtn.evaluate(el => {
const styles = window.getComputedStyle(el);
return {
background: styles.backgroundColor,
opacity: styles.opacity
};
});
console.log(' Zoom active color:', zoomActive);
await page.screenshot({ path: join(screenshotsDir, 'color-swap-4-zoom-active-blue.png') });
// Test 5: Open shortcuts modal and check kbd colors
console.log('\n📸 Test 5: Shortcuts modal kbd elements (should be ORANGE)');
await shortcutsBtn.click();
await page.waitForTimeout(500);
const kbdColor = await page.locator('.shortcut-keys kbd').first().evaluate(el => {
const styles = window.getComputedStyle(el);
return {
color: styles.color,
background: styles.backgroundColor,
borderColor: styles.borderColor
};
});
console.log(' kbd element colors:', kbdColor);
await page.screenshot({ path: join(screenshotsDir, 'color-swap-5-kbd-orange.png') });
console.log('\n✅ Color swap test complete!');
console.log('\n🎯 Summary:');
console.log(' ✓ Zoom button: BLUE (#3498db) when hovered/active');
console.log(' ✓ Shortcuts button: ORANGE (#f39c12) when hovered/at-bottom');
console.log(' ✓ Shortcuts modal kbd: ORANGE (#f39c12) text and borders');
await page.waitForTimeout(5000);
await browser.close();
})();
test-final-colors.mjs
-87
View File
@@ -1,87 +0,0 @@
import { chromium } from '@playwright/test';
import { fileURLToPath } from 'url';
import { dirname, join } from 'path';
import fs from 'fs';
const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);
const screenshotsDir = join(__dirname, 'test-screenshots');
if (!fs.existsSync(screenshotsDir)) {
fs.mkdirSync(screenshotsDir);
}
(async () => {
const browser = await chromium.launch({ headless: false });
const context = await browser.newContext({
viewport: { width: 1920, height: 1080 }
});
const page = await context.newPage();
console.log('🎨 Testing Final Color Scheme...\n');
await page.goto('http://localhost:1999');
await page.waitForLoadState('networkidle');
await page.waitForTimeout(1000);
// Clear storage
await page.evaluate(() => localStorage.clear());
await page.reload();
await page.waitForLoadState('networkidle');
await page.waitForTimeout(500);
const shortcutsBtn = page.locator('#shortcuts-button');
// Open shortcuts modal
console.log('📸 Opening shortcuts modal...');
await shortcutsBtn.click();
await page.waitForTimeout(500);
// Check section header colors (should be ORANGE)
console.log('\n✅ Section Headers (should be ORANGE):');
const sectionTitleColor = await page.locator('.shortcuts-section-title').first().evaluate(el => {
const styles = window.getComputedStyle(el);
return {
color: styles.color,
borderColor: styles.borderBottomColor
};
});
console.log(' Text color:', sectionTitleColor.color);
console.log(' Border color:', sectionTitleColor.borderColor);
const sectionIconColor = await page.locator('.shortcuts-section-title iconify-icon').first().evaluate(el => {
const styles = window.getComputedStyle(el);
return styles.color;
});
console.log(' Icon color:', sectionIconColor);
// Check kbd element colors (should be BLUE)
console.log('\n✅ Keyboard Keys (should be BLUE):');
const kbdStyles = await page.locator('.shortcut-keys kbd').first().evaluate(el => {
const styles = window.getComputedStyle(el);
return {
color: styles.color,
background: styles.backgroundColor,
borderColor: styles.borderColor
};
});
console.log(' Text color:', kbdStyles.color);
console.log(' Background:', kbdStyles.background);
console.log(' Border color:', kbdStyles.borderColor);
// Take screenshot
await page.screenshot({ path: join(screenshotsDir, 'final-colors-modal.png'), fullPage: true });
console.log('\n🎯 Final Color Scheme Summary:');
console.log(' ✓ Section headers: ORANGE (#f39c12)');
console.log(' ✓ Section icons: ORANGE (#f39c12)');
console.log(' ✓ Section borders: Light orange');
console.log(' ✓ Keyboard keys (kbd): BLUE (#3498db)');
console.log(' ✓ kbd backgrounds: Light blue');
console.log(' ✓ kbd borders: Blue');
console.log('\n📁 Screenshot saved to: test-screenshots/final-colors-modal.png');
await page.waitForTimeout(5000);
await browser.close();
})();
test-nav-inspection.js
-113
View File
@@ -1,113 +0,0 @@
const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch();
const context = await browser.newContext({ viewport: { width: 1920, height: 1080 } });
const page = await context.newPage();
try {
console.log('Navigating to http://localhost:1999/?lang=en');
await page.goto('http://localhost:1999/?lang=en', { waitUntil: 'networkidle' });
// Wait for page to settle
await page.waitForTimeout(2000);
// Take full page screenshot
console.log('Taking full-page screenshot...');
await page.screenshot({ path: '/tmp/cv-fullpage.png', fullPage: true });
// Take viewport screenshot (top area)
console.log('Taking viewport screenshot...');
await page.screenshot({ path: '/tmp/cv-viewport.png', clip: { x: 0, y: 0, width: 1920, height: 300 } });
// Get page HTML structure
console.log('\n=== PAGE STRUCTURE (first 2000 chars of body) ===');
const bodyHTML = await page.locator('body').innerHTML();
console.log(bodyHTML.substring(0, 2000));
// Check for header element
console.log('\n=== HEADER ELEMENT ===');
const headers = await page.locator('header').all();
console.log(`Found ${headers.length} header elements`);
if (headers.length > 0) {
const headerHTML = await headers[0].innerHTML();
console.log(headerHTML);
}
// Check for language selector
console.log('\n=== LANGUAGE SELECTOR ===');
const langButtons = await page.locator('button[hx-get*="lang"]').all();
console.log(`Found ${langButtons.length} language buttons`);
for (const btn of langButtons) {
const text = await btn.textContent();
const classes = await btn.getAttribute('class');
const visible = await btn.isVisible();
console.log(`Button: "${text.trim()}" | Classes: ${classes} | Visible: ${visible}`);
}
// Check for any toggle buttons
console.log('\n=== TOGGLE BUTTONS ===');
const toggles = await page.locator('button').all();
console.log(`Found ${toggles.length} total buttons on page`);
for (const toggle of toggles) {
const text = await toggle.textContent();
const classes = await toggle.getAttribute('class');
const id = await toggle.getAttribute('id');
const hxGet = await toggle.getAttribute('hx-get');
const visible = await toggle.isVisible();
console.log(`- "${text.trim()}" | ID: ${id} | Classes: ${classes} | hx-get: ${hxGet} | Visible: ${visible}`);
}
// Check for elements with specific classes
console.log('\n=== ELEMENTS WITH "toggle" IN CLASS ===');
const toggleClass = await page.locator('[class*="toggle"]').all();
console.log(`Found ${toggleClass.length} elements with "toggle" in class`);
for (const el of toggleClass) {
const tagName = await el.evaluate(e => e.tagName);
const classes = await el.getAttribute('class');
const text = await el.textContent();
console.log(`- ${tagName}: ${classes} | Text: "${text.trim().substring(0, 50)}"`);
}
// Check for any elements with "margin" in their text
console.log('\n=== ELEMENTS WITH "MARGIN" TEXT ===');
const marginElements = await page.locator('text=/margin/i').all();
console.log(`Found ${marginElements.length} elements with "margin" in text`);
for (const el of marginElements) {
const text = await el.textContent();
const tagName = await el.evaluate(e => e.tagName);
const classes = await el.getAttribute('class');
console.log(`- ${tagName}: "${text.trim()}" | Classes: ${classes}`);
}
// Get all visible elements in the top 100px
console.log('\n=== ELEMENTS IN TOP 100px ===');
const topElements = await page.evaluate(() => {
const elements = Array.from(document.querySelectorAll('*'));
const topEls = elements.filter(el => {
const rect = el.getBoundingClientRect();
return rect.top >= 0 && rect.top < 100 && rect.width > 0 && rect.height > 0;
}).map(el => ({
tag: el.tagName,
class: el.className,
id: el.id,
text: el.textContent?.substring(0, 50).trim(),
top: el.getBoundingClientRect().top,
left: el.getBoundingClientRect().left,
width: el.getBoundingClientRect().width,
height: el.getBoundingClientRect().height
}));
return topEls.slice(0, 20); // First 20 elements
});
console.log(JSON.stringify(topElements, null, 2));
console.log('\n✅ Screenshots saved to:');
console.log(' /tmp/cv-fullpage.png - Full page');
console.log(' /tmp/cv-viewport.png - Top 300px viewport');
} catch (error) {
console.error('Error:', error);
} finally {
await browser.close();
}
})();
test-refined-colors.mjs
-96
View File
@@ -1,96 +0,0 @@
import { chromium } from '@playwright/test';
import { fileURLToPath } from 'url';
import { dirname, join } from 'path';
import fs from 'fs';
const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);
const screenshotsDir = join(__dirname, 'test-screenshots');
if (!fs.existsSync(screenshotsDir)) {
fs.mkdirSync(screenshotsDir);
}
(async () => {
const browser = await chromium.launch({ headless: false });
const context = await browser.newContext({
viewport: { width: 1920, height: 1080 }
});
const page = await context.newPage();
console.log('🎨 Testing Refined Color Scheme...\n');
await page.goto('http://localhost:1999');
await page.waitForLoadState('networkidle');
await page.waitForTimeout(1000);
// Clear storage
await page.evaluate(() => localStorage.clear());
await page.reload();
await page.waitForLoadState('networkidle');
await page.waitForTimeout(500);
const shortcutsBtn = page.locator('#shortcuts-button');
// Open shortcuts modal
console.log('📸 Opening shortcuts modal...\n');
await shortcutsBtn.click();
await page.waitForTimeout(500);
// Check subtitle color (should be ORANGE)
console.log('✅ Modal Subtitle (should be ORANGE #f39c12):');
const subtitleColor = await page.locator('#shortcuts-modal .info-modal-cv-title').evaluate(el => {
const styles = window.getComputedStyle(el);
return styles.color;
});
console.log(' Color:', subtitleColor);
// Check section header text color (should be #827a6e)
console.log('\n✅ Section Header Text (should be #827a6e - brownish-gray):');
const headerTextColor = await page.locator('.shortcuts-section-title').first().evaluate(el => {
const styles = window.getComputedStyle(el);
return {
color: styles.color,
borderColor: styles.borderBottomColor
};
});
console.log(' Text color:', headerTextColor.color);
console.log(' Border color:', headerTextColor.borderColor);
// Check section header icon color (should be ORANGE)
console.log('\n✅ Section Header Icons (should be ORANGE #f39c12):');
const headerIconColor = await page.locator('.shortcuts-section-title iconify-icon').first().evaluate(el => {
const styles = window.getComputedStyle(el);
return styles.color;
});
console.log(' Icon color:', headerIconColor);
// Check kbd element colors (should be BLUE)
console.log('\n✅ Keyboard Keys (should be BLUE #3498db):');
const kbdStyles = await page.locator('.shortcut-keys kbd').first().evaluate(el => {
const styles = window.getComputedStyle(el);
return {
color: styles.color,
background: styles.backgroundColor,
borderColor: styles.borderColor
};
});
console.log(' Text color:', kbdStyles.color);
console.log(' Background:', kbdStyles.background);
console.log(' Border color:', kbdStyles.borderColor);
// Take screenshot
await page.screenshot({ path: join(screenshotsDir, 'refined-colors-modal.png'), fullPage: true });
console.log('\n🎯 Refined Color Scheme Summary:');
console.log(' ✓ Modal subtitle "Learn the Shortcuts": ORANGE (#f39c12)');
console.log(' ✓ Section header text: Brownish-gray (#827a6e)');
console.log(' ✓ Section header icons: ORANGE (#f39c12)');
console.log(' ✓ Section borders: Light brownish-gray');
console.log(' ✓ Keyboard keys (kbd): BLUE (#3498db)');
console.log('\n📁 Screenshot saved to: test-screenshots/refined-colors-modal.png');
await page.waitForTimeout(5000);
await browser.close();
})();