This commit includes: - Django backend with multi-tenancy (django-tenants) - React + TypeScript frontend with Vite - Platform administration API with role-based access control - Authentication system with token-based auth - Quick login dev tools for testing different user roles - CORS and CSRF configuration for local development - Docker development environment setup 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
81 lines
2.6 KiB
TypeScript
81 lines
2.6 KiB
TypeScript
/**
|
|
* Visual Check Test
|
|
* Ensures pages load with proper styling (not blank white pages)
|
|
*/
|
|
|
|
import { test, expect } from '@playwright/test';
|
|
|
|
test.describe('Visual Check', () => {
|
|
test('should display login page with styling', async ({ page }) => {
|
|
// Navigate to platform subdomain
|
|
await page.goto('http://platform.lvh.me:5173/');
|
|
|
|
// Wait for page to load
|
|
await page.waitForLoadState('networkidle');
|
|
|
|
// Should see login form heading
|
|
await expect(page.getByRole('heading', { name: /sign in/i })).toBeVisible();
|
|
|
|
// Check that page has background color (not blank white)
|
|
const body = page.locator('body');
|
|
const bgColor = await body.evaluate(el => {
|
|
return window.getComputedStyle(el).backgroundColor;
|
|
});
|
|
|
|
console.log('Body background color:', bgColor);
|
|
|
|
// Should have some background color set (Tailwind should be working)
|
|
expect(bgColor).not.toBe('rgba(0, 0, 0, 0)');
|
|
expect(bgColor).not.toBe('');
|
|
|
|
// Check that the form has styling
|
|
const form = page.locator('form').first();
|
|
const formDisplay = await form.evaluate(el => {
|
|
const styles = window.getComputedStyle(el);
|
|
return {
|
|
padding: styles.padding,
|
|
backgroundColor: styles.backgroundColor,
|
|
borderRadius: styles.borderRadius,
|
|
};
|
|
});
|
|
|
|
console.log('Form styles:', formDisplay);
|
|
|
|
// Form should have some padding/styling
|
|
expect(formDisplay.padding).not.toBe('0px');
|
|
});
|
|
|
|
test('should display platform dashboard with styling after login', async ({ page }) => {
|
|
// Navigate and login
|
|
await page.goto('http://platform.lvh.me:5173/');
|
|
await page.fill('input[name="username"]', 'poduck');
|
|
await page.fill('input[name="password"]', 'starry12');
|
|
await page.click('button[type="submit"]');
|
|
|
|
// Wait for navigation/login to complete
|
|
await page.waitForTimeout(3000);
|
|
|
|
// Should be on dashboard
|
|
await page.waitForLoadState('networkidle');
|
|
|
|
// Check that we see content (not blank page)
|
|
const hasContent = await page.locator('body *').count();
|
|
expect(hasContent).toBeGreaterThan(10); // Should have multiple elements
|
|
|
|
// Check for sidebar (part of layout)
|
|
const sidebar = page.locator('aside, nav').first();
|
|
await expect(sidebar).toBeVisible();
|
|
|
|
// Check sidebar has styling
|
|
const sidebarBg = await sidebar.evaluate(el => {
|
|
return window.getComputedStyle(el).backgroundColor;
|
|
});
|
|
|
|
console.log('Sidebar background color:', sidebarBg);
|
|
expect(sidebarBg).not.toBe('rgba(0, 0, 0, 0)');
|
|
|
|
// Take screenshot for verification
|
|
await page.screenshot({ path: 'tests/e2e/dashboard-screenshot.png', fullPage: true });
|
|
});
|
|
});
|