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

test.describe('install-wizard template', () => {
  test('step 1 renders with labeled locale select', async ({ page }) => {
    await page.goto('/install-wizard-demo');
    const localeLabel = page.locator('label[for="locale"]');
    await expect(localeLabel).toBeVisible();
    const localeSelect = page.locator('#locale');
    await expect(localeSelect).toBeVisible();
  });

  test('navigation: continue advances to step 2 with labeled inputs', async ({ page }) => {
    await page.goto('/install-wizard-demo');
    await page.locator('#install-next').click();
    await expect(page.locator('label[for="siteTitle"]')).toBeVisible();
    await expect(page.locator('#siteTitle')).toBeVisible();
    await expect(page.locator('label[for="tagline"]')).toBeVisible();
  });

  test('harness redness: label removal is detectable', async ({ page }) => {
    await page.goto('/install-wizard-demo');
    await expect(page.locator('label[for="locale"]')).toBeVisible();
    await page.evaluate(() => { document.querySelector('label[for="locale"]')?.remove(); });
    await expect(page.locator('label[for="locale"]')).not.toBeVisible();
    await expect(page.locator('#locale')).toBeVisible();
  });
});