71 lines
2.1 KiB
JavaScript
71 lines
2.1 KiB
JavaScript
|
#!/usr/bin/env bun
|
||
|
|
/**
|
||
|
|
* DEBUG: Find which element has white background in dark theme
|
||
|
|
*/
|
||
|
|
|
||
|
|
import { chromium } from "playwright";
|
||
|
|
|
||
|
|
const URL = "http://localhost:1999";
|
||
|
|
|
||
|
|
async function debugDarkTheme() {
|
||
|
|
console.log("🔍 DARK THEME BACKGROUND DEBUG\n");
|
||
|
|
|
||
|
|
const browser = await chromium.launch({ headless: false });
|
||
|
|
const page = await browser.newPage({ viewport: { width: 1400, height: 1080 } });
|
||
|
|
await page.goto(URL);
|
||
|
|
await page.waitForTimeout(2000);
|
||
|
|
|
||
|
|
// Switch to dark theme (click twice: auto→light→dark)
|
||
|
|
console.log("Switching to dark theme...");
|
||
|
|
await page.click('.color-theme-switcher');
|
||
|
|
await page.waitForTimeout(300);
|
||
|
|
await page.click('.color-theme-switcher');
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
const backgrounds = await page.evaluate(() => {
|
||
|
|
const elements = {
|
||
|
|
html: document.documentElement,
|
||
|
|
body: document.body,
|
||
|
|
cvPage: document.querySelector('.cv-page'),
|
||
|
|
pageContent: document.querySelector('.page-content'),
|
||
|
|
cvMain: document.querySelector('.cv-main'),
|
||
|
|
cvPaper: document.querySelector('.cv-paper'),
|
||
|
|
cvContainer: document.querySelector('.cv-container'),
|
||
|
|
};
|
||
|
|
|
||
|
|
const results = {};
|
||
|
|
for (const [name, el] of Object.entries(elements)) {
|
||
|
|
if (el) {
|
||
|
|
const styles = window.getComputedStyle(el);
|
||
|
|
results[name] = {
|
||
|
|
background: styles.background,
|
||
|
|
backgroundColor: styles.backgroundColor,
|
||
|
|
className: el.className,
|
||
|
|
};
|
||
|
|
} else {
|
||
|
|
results[name] = { error: 'Element not found' };
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return results;
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log("\nElement backgrounds in DARK theme:\n");
|
||
|
|
for (const [name, info] of Object.entries(backgrounds)) {
|
||
|
|
console.log(`${name}:`);
|
||
|
|
if (info.error) {
|
||
|
|
console.log(` ❌ ${info.error}`);
|
||
|
|
} else {
|
||
|
|
console.log(` Class: ${info.className || '(none)'}`);
|
||
|
|
console.log(` background: ${info.background}`);
|
||
|
|
console.log(` backgroundColor: ${info.backgroundColor}`);
|
||
|
|
}
|
||
|
|
console.log();
|
||
|
|
}
|
||
|
|
|
||
|
|
console.log("\nBrowser will stay open for inspection...");
|
||
|
|
await page.waitForTimeout(60000);
|
||
|
|
await browser.close();
|
||
|
|
}
|
||
|
|
|
||
|
|
await debugDarkTheme();
|