diff --git a/tests/example.spec.js b/tests/example.spec.js new file mode 100644 index 0000000..26ed206 --- /dev/null +++ b/tests/example.spec.js @@ -0,0 +1,19 @@ +// @ts-check +import { test, expect } from '@playwright/test'; + +test('has title', async ({ page }) => { + await page.goto('https://playwright.dev/'); + + // Expect a title "to contain" a substring. + await expect(page).toHaveTitle(/Playwright/); +}); + +test('get started link', async ({ page }) => { + await page.goto('https://playwright.dev/'); + + // Click the get started link. + await page.getByRole('link', { name: 'Get started' }).click(); + + // Expects page to have a heading with the name of Installation. + await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible(); +}); diff --git a/tests/front.spec.js b/tests/front.spec.js index 6740cbb..16a2eac 100644 --- a/tests/front.spec.js +++ b/tests/front.spec.js @@ -9,56 +9,115 @@ test('Navigation between pages', async ({ page }) => { // Aller à la page d'accueil await page.goto('http://localhost:5173/'); - // Vérifier que le lien "Canvas" est visible et cliquable - const canvasLink = page.locator('text=Canvas'); - await expect(canvasLink).toBeVisible(); - await canvasLink.click(); - // Vérifier que l'URL a changé pour la page Canvas + await page.click('text=Canvas'); await expect(page).toHaveURL(/canvas/); - // Vérifier que le lien "Home" est visible et cliquable - const homeLink = page.locator('text=Home'); - await expect(homeLink).toBeVisible(); - await homeLink.click(); - - // Vérifier que l'URL est revenue à la page d'accueil + // Vérifier que l'URL a changé pour la page Home + await page.click('text=Home'); await expect(page).toHaveURL(/\//); -}); -test('Page Canvas ', async ({ page }) => { + +}); +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'); - // Vérifier que le titre de la page est visible - const pageTitle = page.locator('text=Page Canvas'); - await expect(pageTitle).toBeVisible(); + const sections = [ + '1. Problème', '2. Segments', '3. Valeur', '4. Solution', + '5. Avantage', '6. Canaux', '7. Indicateurs', '8. Coûts', '9. Revenus' + ]; - // Vérifier que la grille d'éléments est visible - const canvasGrid = page.locator('.canvas'); - await expect(canvasGrid).toBeVisible(); + for (const section of sections) { + await expect(page.locator(`text=${section}`)).toBeVisible(); + } - // Vérifier que plusieurs éléments sont présents dans la grille - //const canvasItems = canvasGrid.locator('.CanvasItem'); - //await expect(canvasItems).toHaveCount(9); // On suppose qu'il y a 9 éléments }); -//test('Contact dropdown menu works', async ({ page }) => { - // Aller à la page Canvas - //await page.goto('http://localhost:5173/canvas'); +test('Vérifier le contenu de la page Canvas', async ({ page }) => { + await page.goto('http://localhost:5173/canvas'); - // Vérifier que le bouton "Contact" est visible - //const contactButton = page.locator('button', { hasText: 'Contact' }); - //await expect(contactButton).toBeVisible(); + // Attendre le chargement des éléments + await page.waitForSelector('.canvas'); - // Cliquer sur le bouton "Contact" pour ouvrir le menu déroulant - //await contactButton.click(); + // Vérifier le titre + await expect(page.locator('h1')).toHaveText('Page Canvas'); - // Vérifier que le menu déroulant est visible - //const dropdownMenu = page.locator('.contact-dropdown'); - //await expect(dropdownMenu).toBeVisible(); + // 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); - // Vérifier que le menu contient des options - //const dropdownOptions = dropdownMenu.locator('button'); - //await expect(dropdownOptions).toHaveCountGreaterThan(0); -//}); \ No newline at end of file + // 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(); + }); +});