- Implemented tests for debugging browser cache vs server response. - Verified calendar displays correct dates for November 2025. - Added visual inspection screenshot for calendar layout. - Created tests to ensure calendar fits within its container. - Checked for correct styling of available and blocked dates. - Debugged login form behavior and cookie handling. - Added tests for forced browser refresh and cache verification. - Conducted visual tests to compare actual calendar layout with expected. - Enhanced logging for better traceability during test execution.
54 lines
2.0 KiB
TypeScript
54 lines
2.0 KiB
TypeScript
import { test } from '@playwright/test';
|
|
|
|
test('Debug browser cache vs server response', async ({ page }) => {
|
|
// Completely clear cache and storage
|
|
await page.context().clearCookies();
|
|
|
|
// Set basic auth header
|
|
await page.setExtraHTTPHeaders({
|
|
'Authorization': 'Basic ' + Buffer.from('brotha:makefood1').toString('base64'),
|
|
'Cache-Control': 'no-cache, no-store, must-revalidate',
|
|
'Pragma': 'no-cache',
|
|
'Expires': '0'
|
|
});
|
|
|
|
console.log('1. Going to page with cache disabled...');
|
|
await page.goto('http://localhost:3000/admin/availability', {
|
|
waitUntil: 'networkidle'
|
|
});
|
|
|
|
await page.waitForSelector('.cook-calendar', { timeout: 10000 });
|
|
await page.waitForTimeout(3000);
|
|
|
|
// Check what we get immediately
|
|
const headers1 = await page.locator('.cook-calendar thead th').allTextContents();
|
|
const firstRow1 = await page.locator('.cook-calendar tbody tr:first-child td button').allTextContents();
|
|
|
|
console.log('2. Initial load:');
|
|
console.log(' Headers:', headers1.join(' '));
|
|
console.log(' First row:', firstRow1.join(' '));
|
|
|
|
// Force another reload with cache busting
|
|
console.log('3. Hard reload...');
|
|
await page.reload({ waitUntil: 'networkidle' });
|
|
await page.waitForTimeout(2000);
|
|
|
|
const headers2 = await page.locator('.cook-calendar thead th').allTextContents();
|
|
const firstRow2 = await page.locator('.cook-calendar tbody tr:first-child td button').allTextContents();
|
|
|
|
console.log('4. After reload:');
|
|
console.log(' Headers:', headers2.join(' '));
|
|
console.log(' First row:', firstRow2.join(' '));
|
|
|
|
// Check if there's a difference between SSR and client hydration
|
|
const pageSource = await page.content();
|
|
if (pageSource.includes('27</button></td><td class="rdp-cell"')) {
|
|
console.log('5. Server-side rendered content found in HTML');
|
|
} else {
|
|
console.log('5. Content appears to be client-side only');
|
|
}
|
|
|
|
// Take final screenshot
|
|
await page.screenshot({ path: 'final-calendar-debug.png' });
|
|
console.log('6. Screenshot saved as final-calendar-debug.png');
|
|
}); |