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

test.describe('Bottom Navigation', () => {
  test.beforeEach(async ({ page }) => {
    await page.goto('/');
  });

  test('shows all 5 nav items', async ({ page }) => {
    await expect(page.getByText('Home')).toBeVisible();
    await expect(page.getByText('Playlist')).toBeVisible();
    await expect(page.getByText('Search')).toBeVisible();
    await expect(page.getByText('Internet Radio')).toBeVisible();
    await expect(page.getByText('Create')).toBeVisible();
  });

  test('Home nav item is active on home page', async ({ page }) => {
    const homeNav = page.getByText('Home');
    await expect(homeNav).toBeVisible();
  });

  test('clicking Playlist nav navigates to playlist page', async ({ page }) => {
    await page.getByText('Playlist').click();
    await expect(page).toHaveURL(/\/playlist/);
  });

  test('clicking Search nav navigates to search page', async ({ page }) => {
    await page.getByText('Search').click();
    await expect(page).toHaveURL(/\/search/);
  });

  test('clicking Internet Radio nav navigates to radio page', async ({ page }) => {
    await page.getByText('Internet Radio').click();
    await expect(page).toHaveURL(/\/radio/);
  });

  test('clicking Create nav navigates to create page', async ({ page }) => {
    await page.getByText('Create').click();
    await expect(page).toHaveURL(/\/create/);
  });

  test('nav is visible on all pages', async ({ page }) => {
    await page.getByText('Search').click();
    await expect(page.getByText('Home')).toBeVisible();
    await expect(page.getByText('Create')).toBeVisible();
  });
});