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

test.use({ viewport: { width: 390, height: 844 } });

test('mobile navigation opens modally, closes with Escape, and returns focus', async ({ page }) => {
  await page.goto('/en');
  const trigger = page.getByRole('button', { name: 'Open navigation menu' });
  await trigger.focus();
  await trigger.click();

  const dialog = page.getByRole('dialog', { name: 'Primary navigation' });
  await expect(dialog).toBeVisible();
  await expect(page.locator('body')).toHaveAttribute('data-navigation-open', 'true');
  await expect(page.getByRole('button', { name: 'Close navigation menu' })).toBeFocused();

  await page.keyboard.press('Escape');
  await expect(dialog).not.toBeVisible();
  await expect(trigger).toBeFocused();
});

test('skip navigation moves focus to the main landmark', async ({ page }) => {
  await page.goto('/en');
  await page.keyboard.press('Tab');
  const skip = page.getByRole('link', { name: 'Skip to main content' });
  await expect(skip).toBeFocused();
  await skip.press('Enter');
  await expect(page.locator('#main-content')).toBeFocused();
});