71 lines
2.3 KiB
JavaScript
71 lines
2.3 KiB
JavaScript
|
#!/usr/bin/env bun
|
||
|
|
/**
|
||
|
|
* VIEW SWITCHER TEST
|
||
|
|
* Test the clean/complete view toggle
|
||
|
|
*/
|
||
|
|
|
||
|
|
import { chromium } from "playwright";
|
||
|
|
|
||
|
|
const URL = "http://localhost:1999";
|
||
|
|
|
||
|
|
async function testViewSwitcher() {
|
||
|
|
console.log("🧪 VIEW SWITCHER TEST\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);
|
||
|
|
|
||
|
|
console.log("1️⃣ Initial state:");
|
||
|
|
const initial = await page.evaluate(() => {
|
||
|
|
const container = document.querySelector('.cv-container');
|
||
|
|
const toggle = document.querySelector('#viewToggle');
|
||
|
|
return {
|
||
|
|
containerClass: container?.className,
|
||
|
|
toggleChecked: toggle?.checked,
|
||
|
|
isClean: container?.classList.contains('theme-clean'),
|
||
|
|
};
|
||
|
|
});
|
||
|
|
console.log(` Container class: ${initial.containerClass}`);
|
||
|
|
console.log(` Toggle checked: ${initial.toggleChecked}`);
|
||
|
|
console.log(` Is clean theme: ${initial.isClean}`);
|
||
|
|
|
||
|
|
console.log("\n2️⃣ Clicking view toggle...");
|
||
|
|
try {
|
||
|
|
// Try clicking the label
|
||
|
|
await page.click('label[for="viewToggle"]', { timeout: 5000 });
|
||
|
|
await page.waitForTimeout(500);
|
||
|
|
|
||
|
|
const afterClick = await page.evaluate(() => {
|
||
|
|
const container = document.querySelector('.cv-container');
|
||
|
|
const toggle = document.querySelector('#viewToggle');
|
||
|
|
return {
|
||
|
|
containerClass: container?.className,
|
||
|
|
toggleChecked: toggle?.checked,
|
||
|
|
isClean: container?.classList.contains('theme-clean'),
|
||
|
|
};
|
||
|
|
});
|
||
|
|
|
||
|
|
console.log(` Container class: ${afterClick.containerClass}`);
|
||
|
|
console.log(` Toggle checked: ${afterClick.toggleChecked}`);
|
||
|
|
console.log(` Is clean theme: ${afterClick.isClean}`);
|
||
|
|
|
||
|
|
if (afterClick.isClean !== initial.isClean) {
|
||
|
|
console.log(`\n ✅ View switcher working!`);
|
||
|
|
} else {
|
||
|
|
console.log(`\n ❌ View switcher NOT working - theme didn't change`);
|
||
|
|
}
|
||
|
|
} catch (error) {
|
||
|
|
console.log(` ❌ Error: ${error.message}`);
|
||
|
|
}
|
||
|
|
|
||
|
|
await page.screenshot({ path: 'tests/screenshots/view-switcher.png' });
|
||
|
|
console.log(`\n📸 Screenshot: tests/screenshots/view-switcher.png`);
|
||
|
|
|
||
|
|
console.log("\nBrowser will close in 10 seconds...");
|
||
|
|
await page.waitForTimeout(10000);
|
||
|
|
await browser.close();
|
||
|
|
}
|
||
|
|
|
||
|
|
await testViewSwitcher();
|