58 lines
2.3 KiB
JavaScript
58 lines
2.3 KiB
JavaScript
const { chromium } = require('playwright');
|
|
|
|
(async () => {
|
|
const browser = await chromium.launch({ headless: false, slowMo: 400 });
|
|
const context = await browser.newContext({
|
|
viewport: { width: 1920, height: 1080 } // Desktop - controls visible > 900px
|
|
});
|
|
const page = await context.newPage();
|
|
|
|
// Listen for console errors
|
|
page.on('console', msg => {
|
|
const text = msg.text();
|
|
const type = msg.type();
|
|
if (type === 'error' || text.toLowerCase().includes('error')) {
|
|
console.log('❌ CONSOLE ERROR:', text);
|
|
}
|
|
});
|
|
page.on('pageerror', error => console.log('❌ PAGE EXCEPTION:', error.message));
|
|
|
|
console.log('📄 Loading page (desktop 1920px - controls visible)...');
|
|
await page.goto('http://localhost:1999/?lang=en');
|
|
await page.waitForLoadState('networkidle');
|
|
await page.waitForTimeout(1000);
|
|
|
|
console.log('\n🖱️ TEST 1: Click desktop theme toggle...');
|
|
await page.locator('.selector-group').filter({ hasText: 'View' }).locator('label.icon-toggle').click();
|
|
await page.waitForTimeout(2000);
|
|
console.log('✅ Desktop toggle complete - No errors!');
|
|
|
|
console.log('\n🖱️ TEST 2: Click desktop theme toggle again (toggle back)...');
|
|
await page.locator('.selector-group').filter({ hasText: 'View' }).locator('label.icon-toggle').click();
|
|
await page.waitForTimeout(2000);
|
|
console.log('✅ Desktop toggle back complete - No errors!');
|
|
|
|
console.log('\n📱 TEST 3: Resize to mobile and test menu sync...');
|
|
await page.setViewportSize({ width: 600, height: 800 });
|
|
await page.waitForTimeout(500);
|
|
|
|
console.log('🍔 Opening hamburger menu...');
|
|
await page.click('.hamburger-btn');
|
|
await page.waitForTimeout(500);
|
|
|
|
console.log('🔍 Checking mobile toggle state...');
|
|
const mobileChecked = await page.locator('#themeToggleMenu').isChecked();
|
|
const expectedState = false; // Should be default (not clean)
|
|
console.log(` Mobile toggle checked: ${mobileChecked} (expected: ${expectedState})`);
|
|
|
|
if (mobileChecked === expectedState) {
|
|
console.log(' ✅ Toggles are SYNCED!');
|
|
} else {
|
|
console.log(' ❌ Toggles are OUT OF SYNC!');
|
|
}
|
|
|
|
console.log('\n✅ All tests complete - Check for errors above');
|
|
await page.waitForTimeout(1000);
|
|
await browser.close();
|
|
})();
|