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

test('Title Page',async({page}) =>{
    await page.goto('http://localhost:5173/')
    await expect(page).toHaveTitle(/Vite App/)
})

test('Navigation between pages', async ({ page }) => {
  // Aller à la page d'accueil
  await page.goto('http://localhost:5173/');

  // Vérifier que l'URL a changé pour la page Canvas
  await page.click('text=Canvas');
  await expect(page).toHaveURL(/canvas/);

  // Vérifier que l'URL a changé pour la page Home
  await page.click('text=Home');
  await expect(page).toHaveURL(/\//);


});
test.describe('Tests de la Page Canvas', () => {
test('Vérifier que tous les blocs Canvas sont affichés', async ({ page }) => {
  // Aller à la page Canvas
  await page.goto('http://localhost:5173/canvas');
  await expect(page.locator('h1')).toHaveText('Page Canvas');

    const sections = [
        '1. Problème', '2. Segments', '3. Valeur', '4. Solution',
        '5. Avantage', '6. Canaux', '7. Indicateurs', '8. Coûts', '9. Revenus'
    ];

    for (const section of sections) {
        await expect(page.locator(`text=${section}`)).toBeVisible();
    }

});

test('Vérifier le contenu de la page Canvas', async ({ page }) => {
  await page.goto('http://localhost:5173/canvas');

  // Attendre le chargement des éléments
  await page.waitForSelector('.canvas');

  // Vérifier le titre
  await expect(page.locator('h1')).toHaveText('Page Canvas');

  // Nouveau sélecteur plus précis
  const canvasItems = page.locator('.canvas > div'); // Sélectionne les div directes dans .canvas
  
  // Vérifier le nombre d'éléments
  await expect(canvasItems).toHaveCount(9);

  // Contenu attendu
  const expectedContent = [
    { title: '1. Problème', description: '3 problèmes essentiels à résoudre pour le client' },
    { title: '2. Segments', description: 'Les segments de clientèle visés' },
    { title: '3. Valeur', description: 'La proposition de valeur' },
    { title: '4. Solution', description: 'Les solutions proposées' },
    { title: '5. Avantage', description: 'Les avantages concurrentiels' },
    { title: '6. Canaux', description: 'Les canaux de distribution' },
    { title: '7. Indicateurs', description: 'Les indicateurs clés de performance' },
    { title: '8. Coûts', description: 'Les coûts associés' },
    { title: '9. Revenus', description: 'Les sources de revenus' }
  ];

  // Vérifier chaque élément
  for (let i = 0; i < expectedContent.length; i++) {
    const item = canvasItems.nth(i);
    await expect(item.locator('h3')).toHaveText(expectedContent[i].title);
    await expect(item.locator('p')).toHaveText(expectedContent[i].description);
  }
});
});

test.describe('Tests de la page Home', () => {
    
  test('Vérifier la présence des projets', async ({ page }) => {
      await page.goto('http://localhost:5173');

      // Vérifier les titres des projets avec getByRole pour éviter les doublons
      await expect(page.getByRole('heading', { name: 'Projet Alpha' })).toBeVisible();
      await expect(page.getByRole('heading', { name: 'Projet Beta' })).toBeVisible();
  });

  test('Vérifier les membres des projets', async ({ page }) => {
      await page.goto('http://localhost:5173');

      const membresAlpha = ['Alice', 'Bob', 'Charlie'];
      const membresBeta = ['David', 'Eve', 'Frank'];

      for (const membre of membresAlpha) {
          await expect(page.getByText(membre)).toBeVisible();
      }
      for (const membre of membresBeta) {
          await expect(page.getByText(membre)).toBeVisible();
      }
  });

  test('Vérifier les boutons Contact', async ({ page }) => {
      await page.goto('http://localhost:5173');

      // Vérifier que les boutons "Contact" existent et sont visibles
      const contactButtons = await page.locator('button:has-text("Contact")').count();
      expect(contactButtons).toBe(2); // Vérifie qu'il y a bien 2 boutons Contact
  });

  test('Vérifier la table des rendez-vous', async ({ page }) => {
      await page.goto('http://localhost:5173');

      await expect(page.getByRole('heading', { name: 'Rendez-vous' })).toBeVisible();

      // Vérifier la première ligne du tableau
      await expect(page.locator('table').getByRole('cell', { name: 'Projet Alpha' })).toBeVisible();
      await expect(page.getByText('2025-03-10')).toBeVisible();
      await expect(page.getByText('P106')).toBeVisible();

      // Vérifier la deuxième ligne du tableau
      await expect(page.locator('table').getByRole('cell', { name: 'Projet Beta' })).toBeVisible();
      await expect(page.getByText('2025-04-15')).toBeVisible();
      await expect(page.getByText('Td10')).toBeVisible();
  });
});