(e2e) update test suite to use '/docs/' route

- Modify all test files to navigate to '/docs/' instead of '/'
- Add explicit login button click for authentication tests
- Update routing and navigation expectations in test specs
- Introduce new home page test spec
- Ensure consistent authentication flow across test scenarios
This commit is contained in:
Nathan Panchout
2025-01-29 17:21:02 +01:00
parent 2d0a50984b
commit 225366e92d
20 changed files with 185 additions and 114 deletions
@@ -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/');
});
});
@@ -3,7 +3,8 @@ 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()
@@ -11,7 +12,8 @@ setup('authenticate-chromium', async ({ page }) => {
});
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()
@@ -19,7 +21,8 @@ setup('authenticate-webkit', async ({ page }) => {
});
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()
@@ -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');
});
});
@@ -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 });
@@ -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,
@@ -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', () => {
@@ -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 }) => {
@@ -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 }) => {
@@ -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', () => {
@@ -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', () => {
@@ -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();
});
});
@@ -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(
@@ -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('Doc Table Content', () => {
@@ -8,7 +8,7 @@ import {
} from './common';
test.beforeEach(async ({ page }) => {
await page.goto('/');
await page.goto('/docs/');
});
test.describe('Doc Version', () => {
@@ -6,7 +6,7 @@ const browsersName = ['chromium', 'webkit', 'firefox'];
test.describe('Doc Visibility', () => {
test.beforeEach(async ({ page }) => {
await page.goto('/');
await page.goto('/docs/');
});
test('It checks the copy link button', async ({ page, browserName }) => {
@@ -71,7 +71,8 @@ test.describe('Doc Visibility: Restricted', () => {
page,
browserName,
}) => {
await page.goto('/');
await page.goto('/docs/');
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();
});
@@ -102,7 +103,8 @@ test.describe('Doc Visibility: Restricted', () => {
page,
browserName,
}) => {
await page.goto('/');
await page.goto('/docs/');
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);
@@ -130,7 +133,8 @@ test.describe('Doc Visibility: Restricted', () => {
test('A doc is accessible when member.', async ({ page, browserName }) => {
test.slow();
await page.goto('/');
await page.goto('/docs/');
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);
@@ -186,7 +191,8 @@ test.describe('Doc Visibility: Public', () => {
page,
browserName,
}) => {
await page.goto('/');
await page.goto('/docs/');
await page.getByTestId('proconnect-button').first().click();
await keyCloakSignIn(page, browserName);
const [docTitle] = await createDoc(
@@ -247,7 +253,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);
@@ -265,7 +271,8 @@ test.describe('Doc Visibility: Public', () => {
page,
browserName,
}) => {
await page.goto('/');
await page.goto('/docs/');
await page.getByTestId('proconnect-button').first().click();
await keyCloakSignIn(page, browserName);
const [docTitle] = await createDoc(page, 'Public editable', browserName, 1);
@@ -313,7 +320,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);
@@ -329,7 +336,8 @@ test.describe('Doc Visibility: Authenticated', () => {
page,
browserName,
}) => {
await page.goto('/');
await page.goto('/docs/');
await page.getByTestId('proconnect-button').first().click();
await keyCloakSignIn(page, browserName);
const [docTitle] = await createDoc(
@@ -364,11 +372,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();
});
@@ -376,7 +385,8 @@ test.describe('Doc Visibility: Authenticated', () => {
page,
browserName,
}) => {
await page.goto('/');
await page.goto('/docs/');
await page.getByTestId('proconnect-button').first().click();
await keyCloakSignIn(page, browserName);
const [docTitle] = await createDoc(
@@ -412,6 +422,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);
@@ -426,7 +437,8 @@ test.describe('Doc Visibility: Authenticated', () => {
page,
browserName,
}) => {
await page.goto('/');
await page.goto('/docs/');
await page.getByTestId('proconnect-button').first().click();
await keyCloakSignIn(page, browserName);
const [docTitle] = await createDoc(
@@ -468,6 +480,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);
@@ -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('/');
await page.goto('/docs/');
});
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('/docs/');
await expect(page.locator('footer')).toBeHidden();
});
@@ -4,7 +4,7 @@ import { keyCloakSignIn } from './common';
test.describe('Header', () => {
test.beforeEach(async ({ page }) => {
await page.goto('/');
await page.goto('/docs/');
});
test('checks all the elements are visible', async ({ page }) => {
@@ -69,7 +69,7 @@ test.describe('Header mobile', () => {
test.use({ viewport: { width: 500, height: 1200 } });
test.beforeEach(async ({ page }) => {
await page.goto('/');
await page.goto('/docs/');
});
test('it checks the header when mobile', async ({ page }) => {
@@ -89,7 +89,8 @@ test.describe('Header: Log out', () => {
test.use({ storageState: { cookies: [], origins: [] } });
test('checks logout button', async ({ page, browserName }) => {
await page.goto('/');
await page.goto('/docs/');
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);
});
});
@@ -0,0 +1,49 @@
import { expect, test } from '@playwright/test';
test.beforeEach(async ({ page }) => {
await page.goto('/docs/');
});
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();
});
});
@@ -1,7 +1,7 @@
import { expect, test } from '@playwright/test';
test.beforeEach(async ({ page }) => {
await page.goto('/');
await page.goto('/docs/');
});
test.describe('Language', () => {
@@ -2,7 +2,7 @@ import { expect, test } from '@playwright/test';
test.describe('Left panel desktop', () => {
test.beforeEach(async ({ page }) => {
await page.goto('/');
await page.goto('/docs/');
});
test('checks all the elements are visible', async ({ page }) => {
@@ -17,7 +17,7 @@ test.describe('Left panel mobile', () => {
test.use({ viewport: { width: 500, height: 1200 } });
test.beforeEach(async ({ page }) => {
await page.goto('/');
await page.goto('/docs/');
});
test('checks all the desktop elements are hidden and all mobile elements are visible', async ({