✅(frontend) add and update tests

- Added clicks on the ProConnect button in various authentication tests
to ensure proper user flow.
- Introduced a new home.spec.ts file to validate visibility of elements
on the home page.
- update all tests for the auth flow

src/frontend/apps/e2e/__tests__/app-impress/auth.setup.ts

@@ -4,6 +4,7 @@ import { keyCloakSignIn } from './common';
 
 setup('authenticate-chromium', async ({ page }) => {
   await page.goto('/');
+  await page.getByTestId('proconnect-button').first().click();
   await keyCloakSignIn(page, 'chromium');
   await page
     .context()
@@ -12,6 +13,7 @@ setup('authenticate-chromium', async ({ page }) => {
 
 setup('authenticate-webkit', async ({ page }) => {
   await page.goto('/');
+  await page.getByTestId('proconnect-button').first().click();
   await keyCloakSignIn(page, 'webkit');
   await page
     .context()
@@ -20,6 +22,7 @@ setup('authenticate-webkit', async ({ page }) => {
 
 setup('authenticate-firefox', async ({ page }) => {
   await page.goto('/');
+  await page.getByTestId('proconnect-button').first().click();
   await keyCloakSignIn(page, 'firefox');
   await page
     .context()

src/frontend/apps/e2e/__tests__/app-impress/config.spec.ts

@@ -77,6 +77,7 @@ test.describe('Config', () => {
 
     const jsonResponse = await response.json();
     expect(jsonResponse.FRONTEND_THEME).toStrictEqual('dsfr');
+    await page.getByLabel('Logout').click();
 
     const footer = page.locator('footer').first();
     // alt 'Gouvernement Logo' comes from the theme

src/frontend/apps/e2e/__tests__/app-impress/doc-routing.spec.ts

@@ -63,16 +63,16 @@ test.describe('Doc Routing: Not loggued', () => {
     await page.goto('/docs/mocked-document-id/');
     await expect(page.locator('h2').getByText('Mocked document')).toBeVisible();
     await page.getByRole('button', { name: 'Login' }).click();
+
     await keyCloakSignIn(page, browserName);
     await expect(page.locator('h2').getByText('Mocked document')).toBeVisible();
   });
 
-  test('The homepage redirects to login.', async ({ page }) => {
+  test('Check is redirected to home page if user is not logged', async ({
+    page,
+  }) => {
     await page.goto('/');
-    await expect(
-      page.getByRole('button', {
-        name: 'Sign In',
-      }),
-    ).toBeVisible();
+
+    await expect(page.getByTestId('proconnect-button').first()).toBeVisible();
   });
 });

src/frontend/apps/e2e/__tests__/app-impress/doc-visibility.spec.ts

@@ -72,6 +72,7 @@ test.describe('Doc Visibility: Restricted', () => {
     browserName,
   }) => {
     await page.goto('/');
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     const [docTitle] = await createDoc(
@@ -91,9 +92,9 @@ test.describe('Doc Visibility: Restricted', () => {
       })
       .click();
 
-    await expect(page.getByRole('button', { name: 'Sign in' })).toBeVisible();
-
+    await expect(page.getByTestId('proconnect-button').first()).toBeVisible();
     await page.goto(urlDoc);
+    await page.getByTestId('proconnect-button').first().click();
 
     await expect(page.getByRole('textbox', { name: 'password' })).toBeVisible();
   });
@@ -103,6 +104,7 @@ test.describe('Doc Visibility: Restricted', () => {
     browserName,
   }) => {
     await page.goto('/');
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     const [docTitle] = await createDoc(page, 'Restricted auth', browserName, 1);
@@ -119,6 +121,7 @@ test.describe('Doc Visibility: Restricted', () => {
 
     const otherBrowser = browsersName.find((b) => b !== browserName);
 
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, otherBrowser!);
 
     await page.goto(urlDoc);
@@ -131,6 +134,7 @@ test.describe('Doc Visibility: Restricted', () => {
   test('A doc is accessible when member.', async ({ page, browserName }) => {
     test.slow();
     await page.goto('/');
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     const [docTitle] = await createDoc(page, 'Restricted auth', browserName, 1);
@@ -167,6 +171,7 @@ test.describe('Doc Visibility: Restricted', () => {
       })
       .click();
 
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, otherBrowser!);
 
     await page.goto(urlDoc);
@@ -184,6 +189,7 @@ test.describe('Doc Visibility: Public', () => {
     browserName,
   }) => {
     await page.goto('/');
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     const [docTitle] = await createDoc(
@@ -240,7 +246,7 @@ test.describe('Doc Visibility: Public', () => {
       })
       .click();
 
-    await expect(page.getByRole('button', { name: 'Sign in' })).toBeVisible();
+    await expect(page.getByTestId('proconnect-button').first()).toBeVisible();
 
     await page.goto(urlDoc);
 
@@ -257,6 +263,7 @@ test.describe('Doc Visibility: Public', () => {
     browserName,
   }) => {
     await page.goto('/');
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     const [docTitle] = await createDoc(page, 'Public editable', browserName, 1);
@@ -304,7 +311,7 @@ test.describe('Doc Visibility: Public', () => {
       })
       .click();
 
-    await expect(page.getByRole('button', { name: 'Sign in' })).toBeVisible();
+    await expect(page.getByTestId('proconnect-button').first()).toBeVisible();
 
     await page.goto(urlDoc);
 
@@ -321,6 +328,7 @@ test.describe('Doc Visibility: Authenticated', () => {
     browserName,
   }) => {
     await page.goto('/');
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     const [docTitle] = await createDoc(
@@ -355,11 +363,12 @@ test.describe('Doc Visibility: Authenticated', () => {
       })
       .click();
 
-    await expect(page.getByRole('button', { name: 'Sign in' })).toBeVisible();
+    await expect(page.getByTestId('proconnect-button').first()).toBeVisible();
 
     await page.goto(urlDoc);
 
     await expect(page.locator('h2').getByText(docTitle)).toBeHidden();
+    await page.getByTestId('proconnect-button').first().click();
     await expect(page.getByRole('textbox', { name: 'password' })).toBeVisible();
   });
 
@@ -368,6 +377,7 @@ test.describe('Doc Visibility: Authenticated', () => {
     browserName,
   }) => {
     await page.goto('/');
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     const [docTitle] = await createDoc(
@@ -403,6 +413,7 @@ test.describe('Doc Visibility: Authenticated', () => {
       .click();
 
     const otherBrowser = browsersName.find((b) => b !== browserName);
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, otherBrowser!);
 
     await page.goto(urlDoc);
@@ -423,6 +434,7 @@ test.describe('Doc Visibility: Authenticated', () => {
     browserName,
   }) => {
     await page.goto('/');
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     const [docTitle] = await createDoc(
@@ -464,6 +476,7 @@ test.describe('Doc Visibility: Authenticated', () => {
       .click();
 
     const otherBrowser = browsersName.find((b) => b !== browserName);
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, otherBrowser!);
 
     await page.goto(urlDoc);

src/frontend/apps/e2e/__tests__/app-impress/footer.spec.ts

@@ -1,12 +1,13 @@
 import { expect, test } from '@playwright/test';
 
-import { goToGridDoc } from './common';
+import { keyCloakSignIn } from './common';
 
 test.beforeEach(async ({ page }) => {
   await page.goto('/');
 });
 
 test.describe('Footer', () => {
+  test.use({ storageState: { cookies: [], origins: [] } });
   test('checks all the elements are visible', async ({ page }) => {
     const footer = page.locator('footer').first();
 
@@ -47,9 +48,14 @@ test.describe('Footer', () => {
     ).toBeVisible();
   });
 
-  test('checks footer is not visible on doc editor', async ({ page }) => {
-    await expect(page.locator('footer')).toBeVisible();
-    await goToGridDoc(page);
+  test('checks footer is not visible on doc editor', async ({
+    page,
+    browserName,
+  }) => {
+    await page.getByTestId('proconnect-button').first().click();
+    await keyCloakSignIn(page, browserName);
+    await page.goto('/');
+
     await expect(page.locator('footer')).toBeHidden();
   });
 

src/frontend/apps/e2e/__tests__/app-impress/header.spec.ts

@@ -90,6 +90,7 @@ test.describe('Header: Log out', () => {
 
   test('checks logout button', async ({ page, browserName }) => {
     await page.goto('/');
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     await page
@@ -98,6 +99,6 @@ test.describe('Header: Log out', () => {
       })
       .click();
 
-    await expect(page.getByRole('button', { name: 'Sign in' })).toBeVisible();
+    await expect(page.getByTestId('proconnect-button')).toHaveCount(2);
   });
 });

src/frontend/apps/e2e/__tests__/app-impress/home.spec.ts

@@ -0,0 +1,49 @@
+import { expect, test } from '@playwright/test';
+
+test.beforeEach(async ({ page }) => {
+  await page.goto('/');
+});
+
+test.describe('Home page', () => {
+  test.use({ storageState: { cookies: [], origins: [] } });
+  test('checks all the elements are visible', async ({ page }) => {
+    // Check header content
+    const header = page.locator('header').first();
+    const footer = page.locator('footer').first();
+    await expect(header).toBeVisible();
+    await expect(
+      header.getByRole('combobox', { name: 'Language' }),
+    ).toBeVisible();
+    await expect(
+      header.getByRole('button', { name: 'Les services de La Suite numé' }),
+    ).toBeVisible();
+    await expect(
+      header.getByRole('img', { name: 'Gouvernement Logo' }),
+    ).toBeVisible();
+    await expect(
+      header.getByRole('img', { name: 'Docs app logo' }),
+    ).toBeVisible();
+    await expect(header.getByRole('heading', { name: 'Docs' })).toBeVisible();
+    await expect(header.getByText('BETA')).toBeVisible();
+
+    // Check the ttile and subtitle are visible
+    await expect(page.getByText('Collaborative writing made')).toBeVisible();
+    await expect(page.getByText('Collaborate and write in real')).toBeVisible();
+    await expect(page.getByText('An uncompromising writing')).toBeVisible();
+    await expect(page.getByText('Docs offers an intuitive')).toBeVisible();
+    await expect(page.getByText('Simple and secure')).toBeVisible();
+    await expect(page.getByText('Docs makes real-time')).toBeVisible();
+    await expect(page.getByText('Flexible export.')).toBeVisible();
+    await expect(page.getByText('To facilitate the circulation')).toBeVisible();
+    await expect(page.getByText('A new way to organize')).toBeVisible();
+    await expect(page.getByText('Docs transforms your')).toBeVisible();
+
+    await expect(page.getByTestId('proconnect-button')).toHaveCount(2);
+
+    // Footer - The footer is already tested in its entirety in the footer.spec.ts file
+    await expect(footer).toBeVisible();
+    await expect(
+      page.getByRole('link', { name: 'expand_more See more' }),
+    ).toBeVisible();
+  });
+});