✨(frontend) add home page

CHANGELOG.md

@@ -51,6 +51,7 @@ and this project adheres to
 - ✨(frontend) add favorite feature #515
 - 📝(documentation) Documentation about self-hosted installation #530
 - ✨(helm) helm versioning #530
+- ✨(frontend) add home page #553
 
 ## Changed
 

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

@@ -1,7 +1,7 @@
 import { expect, test } from '@playwright/test';
 
 test.beforeEach(async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
   await expect(
     page.locator('header').first().locator('h2').getByText('Docs'),
   ).toBeVisible();
@@ -24,6 +24,6 @@ test.describe('404', () => {
     page,
   }) => {
     await page.getByText('Back to home page').click();
-    await expect(page).toHaveURL('/');
+    await expect(page).toHaveURL('/docs/');
   });
 });

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

@@ -3,23 +3,26 @@ import { test as setup } from '@playwright/test';
 import { keyCloakSignIn } from './common';
 
 setup('authenticate-chromium', async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
+  await page.getByTestId('proconnect-button').first().click();
   await keyCloakSignIn(page, 'chromium');
   await page
     .context()
     .storageState({ path: `playwright/.auth/user-chromium.json` });
 });
 
 setup('authenticate-webkit', async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
+  await page.getByTestId('proconnect-button').first().click();
   await keyCloakSignIn(page, 'webkit');
   await page
     .context()
     .storageState({ path: `playwright/.auth/user-webkit.json` });
 });
 
 setup('authenticate-firefox', async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
+  await page.getByTestId('proconnect-button').first().click();
   await keyCloakSignIn(page, 'firefox');
   await page
     .context()

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

@@ -21,13 +21,43 @@ const config = {
 };
 
 test.describe('Config', () => {
+  test('it checks that media server is configured from config endpoint', async ({
+    page,
+    browserName,
+  }) => {
+    await page.goto('/docs/');
+
+    await createDoc(page, 'doc-media', browserName, 1);
+
+    const fileChooserPromise = page.waitForEvent('filechooser');
+
+    await page.locator('.bn-block-outer').last().fill('Anything');
+    await page.locator('.bn-block-outer').last().fill('/');
+    await page.getByText('Resizable image with caption').click();
+    await page.getByText('Upload image').click();
+
+    const fileChooser = await fileChooserPromise;
+    await fileChooser.setFiles(
+      path.join(__dirname, 'assets/logo-suite-numerique.png'),
+    );
+
+    const image = page.getByRole('img', { name: 'logo-suite-numerique.png' });
+
+    await expect(image).toBeVisible();
+
+    // Check src of image
+    expect(await image.getAttribute('src')).toMatch(
+      /http:\/\/localhost:8083\/media\/.*\/attachments\/.*.png/,
+    );
+  });
+
   test('it checks the config api is called', async ({ page }) => {
     const responsePromise = page.waitForResponse(
       (response) =>
         response.url().includes('/config/') && response.status() === 200,
     );
 
-    await page.goto('/');
+    await page.goto('/docs/');
 
     const response = await responsePromise;
     expect(response.ok()).toBeTruthy();
@@ -58,62 +88,11 @@ test.describe('Config', () => {
       predicate: (msg) => msg.text().includes(invalidMsg),
     });
 
-    await page.goto('/');
+    await page.goto('/docs/');
 
     expect((await consoleMessage).text()).toContain(invalidMsg);
   });
 
-  test('it checks that theme is configured from config endpoint', async ({
-    page,
-  }) => {
-    const responsePromise = page.waitForResponse(
-      (response) =>
-        response.url().includes('/config/') && response.status() === 200,
-    );
-
-    await page.goto('/');
-
-    const response = await responsePromise;
-    expect(response.ok()).toBeTruthy();
-
-    const jsonResponse = await response.json();
-    expect(jsonResponse.FRONTEND_THEME).toStrictEqual('dsfr');
-
-    const footer = page.locator('footer').first();
-    // alt 'Gouvernement Logo' comes from the theme
-    await expect(footer.getByAltText('Gouvernement Logo')).toBeVisible();
-  });
-
-  test('it checks that media server is configured from config endpoint', async ({
-    page,
-    browserName,
-  }) => {
-    await page.goto('/');
-
-    await createDoc(page, 'doc-media', browserName, 1);
-
-    const fileChooserPromise = page.waitForEvent('filechooser');
-
-    await page.locator('.bn-block-outer').last().fill('Anything');
-    await page.locator('.bn-block-outer').last().fill('/');
-    await page.getByText('Resizable image with caption').click();
-    await page.getByText('Upload image').click();
-
-    const fileChooser = await fileChooserPromise;
-    await fileChooser.setFiles(
-      path.join(__dirname, 'assets/logo-suite-numerique.png'),
-    );
-
-    const image = page.getByRole('img', { name: 'logo-suite-numerique.png' });
-
-    await expect(image).toBeVisible();
-
-    // Check src of image
-    expect(await image.getAttribute('src')).toMatch(
-      /http:\/\/localhost:8083\/media\/.*\/attachments\/.*.png/,
-    );
-  });
-
   test('it checks that collaboration server is configured from config endpoint', async ({
     page,
     browserName,
@@ -122,7 +101,7 @@ test.describe('Config', () => {
       return webSocket.url().includes('ws://localhost:8083/collaboration/ws/');
     });
 
-    await page.goto('/');
+    await page.goto('/docs');
 
     const randomDoc = await createDoc(
       page,
@@ -154,10 +133,29 @@ test.describe('Config', () => {
       }
     });
 
-    await page.goto('/');
+    await page.goto('/docs/');
 
     await expect(
       page.locator('#crisp-chatbox').getByText('Invalid website'),
     ).toBeVisible();
   });
 });
+
+test.describe('Config footer logo', () => {
+  test('it checks that theme is configured from config endpoint', async ({
+    page,
+  }) => {
+    const responsePromise = page.waitForResponse(
+      (response) =>
+        response.url().includes('/config/') && response.status() === 200,
+    );
+
+    await page.goto('/docs/');
+
+    const response = await responsePromise;
+    expect(response.ok()).toBeTruthy();
+
+    const jsonResponse = await response.json();
+    expect(jsonResponse.FRONTEND_THEME).toStrictEqual('dsfr');
+  });
+});

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

@@ -9,7 +9,7 @@ import {
 } from './common';
 
 test.beforeEach(async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
 });
 
 test.describe('Doc Create', () => {
@@ -62,7 +62,7 @@ test.describe('Doc Create: Not loggued', () => {
     );
 
     expect(newDoc.ok()).toBeTruthy();
-
+    await page.getByTestId('proconnect-button').first().click();
     await keyCloakSignIn(page, browserName);
 
     await goToGridDoc(page, { title });

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

@@ -10,7 +10,7 @@ import {
 } from './common';
 
 test.beforeEach(async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
 });
 
 test.describe('Doc Editor', () => {
@@ -257,7 +257,7 @@ test.describe('Doc Editor', () => {
     await editor.fill('Hello World Doc persisted 2');
     await expect(editor.getByText('Hello World Doc persisted 2')).toBeVisible();
 
-    await page.goto('/');
+    await page.goto('/docs/');
 
     await goToGridDoc(page, {
       title: doc,

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

@@ -7,7 +7,7 @@ import pdf from 'pdf-parse';
 import { createDoc, verifyDocName } from './common';
 
 test.beforeEach(async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
 });
 
 test.describe('Doc Export', () => {

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

@@ -8,14 +8,14 @@ type SmallDoc = {
 };
 
 test.beforeEach(async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
 });
 
 test.describe('Documents Grid mobile', () => {
   test.use({ viewport: { width: 500, height: 1200 } });
 
   test.beforeEach(async ({ page }) => {
-    await page.goto('/');
+    await page.goto('/docs/');
   });
 
   test('it checks the grid when mobile', async ({ page }) => {
@@ -76,7 +76,7 @@ test.describe('Documents Grid mobile', () => {
       }
     });
 
-    await page.goto('/');
+    await page.goto('/docs/');
 
     const docsGrid = page.getByTestId('docs-grid');
     await expect(docsGrid).toBeVisible();
@@ -195,7 +195,7 @@ test.describe('Document grid item options', () => {
         },
       });
     });
-    await page.goto('/');
+    await page.goto('/docs/');
 
     const button = page.getByTestId(
       `docs-grid-actions-button-mocked-document-id`,
@@ -286,7 +286,7 @@ test.describe('Documents filters', () => {
 
 test.describe('Documents Grid', () => {
   test.beforeEach(async ({ page }) => {
-    await page.goto('/');
+    await page.goto('/docs/');
   });
 
   test('checks all the elements are visible', async ({ page }) => {

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

@@ -10,7 +10,7 @@ import {
 } from './common';
 
 test.beforeEach(async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
 });
 
 test.describe('Doc Header', () => {
@@ -434,7 +434,7 @@ test.describe('Documents Header mobile', () => {
   test.use({ viewport: { width: 500, height: 1200 } });
 
   test.beforeEach(async ({ page }) => {
-    await page.goto('/');
+    await page.goto('/docs/');
   });
 
   test('it checks the copy link button', async ({ page, browserName }) => {

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

@@ -3,7 +3,7 @@ import { expect, test } from '@playwright/test';
 import { createDoc, randomName } from './common';
 
 test.beforeEach(async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
 });
 
 test.describe('Document create member', () => {

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

@@ -3,7 +3,7 @@ import { expect, test } from '@playwright/test';
 import { addNewMember, createDoc, goToGridDoc, verifyDocName } from './common';
 
 test.beforeEach(async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
 });
 
 test.describe('Document list members', () => {

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

@@ -4,7 +4,7 @@ import { keyCloakSignIn, mockedDocument } from './common';
 
 test.describe('Doc Routing', () => {
   test.beforeEach(async ({ page }) => {
-    await page.goto('/');
+    await page.goto('/docs/');
   });
 
   test('Check the presence of the meta tag noindex', async ({ page }) => {
@@ -24,7 +24,7 @@ test.describe('Doc Routing', () => {
   });
 
   test('checks alias docs url with homepage', async ({ page }) => {
-    await expect(page).toHaveURL('/');
+    await expect(page).toHaveURL('/docs/');
 
     const buttonCreateHomepage = page.getByRole('button', {
       name: 'New doc',
@@ -62,17 +62,18 @@ test.describe('Doc Routing: Not loggued', () => {
     await mockedDocument(page, { link_reach: 'public' });
     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 }) => {
-    await page.goto('/');
-    await expect(
-      page.getByRole('button', {
-        name: 'Sign In',
-      }),
-    ).toBeVisible();
+  test('Check is redirected to home page if user is not logged', async ({
+    page,
+  }) => {
+    await page.goto('/docs/');
+
+    await expect(page.getByTestId('proconnect-button').first()).toBeVisible();
   });
 });

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

@@ -3,7 +3,7 @@ import { expect, test } from '@playwright/test';
 import { createDoc, verifyDocName } from './common';
 
 test.beforeEach(async ({ page }) => {
-  await page.goto('/');
+  await page.goto('/docs/');
 });
 
 test.describe('Document search', () => {
@@ -15,7 +15,7 @@ test.describe('Document search', () => {
       1,
     );
     await verifyDocName(page, doc1Title);
-    await page.goto('/');
+    await page.goto('/docs/');
 
     const [doc2Title] = await createDoc(
       page,
@@ -24,7 +24,7 @@ test.describe('Document search', () => {
       1,
     );
     await verifyDocName(page, doc2Title);
-    await page.goto('/');
+    await page.goto('/docs/');
     await page.getByRole('button', { name: 'search' }).click();
 
     await expect(