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

test('loads the app shell and WebGPU fallback in Chromium', async ({ page }) => {
  await page.addInitScript(() => {
    Object.defineProperty(navigator, 'gpu', {
      configurable: true,
      value: undefined,
    });
  });

  await page.goto('/');

  await expect(page).toHaveTitle('Fleeting Garden');
  await expect(
    page.getByRole('img', { name: 'Interactive generative garden canvas' })
  ).toBeVisible();
  await expect(page.getByRole('toolbar', { name: 'Garden toolbar' })).toBeVisible();
  await expect(page.locator('body')).not.toHaveClass(/is-loading/);
  await expect(page.getByRole('alert')).toContainText('Fleeting Garden needs WebGPU');

  await page.getByRole('button', { name: 'About' }).click();
  await expect(page.getByRole('heading', { name: 'Fleeting Garden' })).toBeVisible();
});