import { test, expect } from '@playwright/test';

test('Check styles and globals', async ({ page }) => {
    await page.goto('http://localhost:8082/test/form_test.html');
    
    // Check if auto-grid-form is grid (horizontal mode)
    const formH = page.locator('#formH form');
    const display = await formH.evaluate(el => window.getComputedStyle(el).display);
    console.log('formH display:', display);
    expect(display).toBe('grid');

    // Get color picker input to check height
    const colorInput = page.locator('#formH input[type="color"]');
    if (await colorInput.count() > 0) {
        const height = await colorInput.evaluate(el => window.getComputedStyle(el).height);
        console.log('colorInput height:', height);
        // It shouldn't be very small (like 0 or 2px)
        expect(parseInt(height)).toBeGreaterThan(20);
    }
});