From f44a41c5fa6e23ede81b824b4ddc6e4dbd0864d5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?F=C3=A9lix=20Girault?= Date: Thu, 10 Oct 2024 15:53:08 +0200 Subject: [PATCH] Added end-to-end tests --- e2e/orejime.spec.ts | 161 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 161 insertions(+) create mode 100644 e2e/orejime.spec.ts diff --git a/e2e/orejime.spec.ts b/e2e/orejime.spec.ts new file mode 100644 index 00000000..d83b3b5b --- /dev/null +++ b/e2e/orejime.spec.ts @@ -0,0 +1,161 @@ +import {test, expect} from '@playwright/test'; + +test.describe('Orejime', () => { + test.beforeEach(async ({page}) => { + await page.goto('/'); + }); + + test('should show a notice', async ({page}) => { + const notice = await page.locator('.orejime-Notice'); + await expect(notice).toBeVisible(); + }); + + test('should navigate to the notice first', async ({page}) => { + await page.keyboard.press('Tab'); + const firstButton = await page.locator('.orejime-Notice-saveButton'); + await expect(firstButton).toBeVisible(); + }); + + test('should accept all cookies from the notice', async ({page, context}) => { + await page.locator('.orejime-Notice-saveButton').click(); + const notice = await page.locator('.orejime-Notice'); + await expect(notice).not.toBeVisible(); + + const cookies = await context.cookies(); + const orejimeCookie = cookies.find(({name}) => name === 'orejime'); + const consents = JSON.parse(orejimeCookie!.value); + + expect(consents).toEqual(expect.objectContaining({ + 'inline-tracker': true, + 'external-tracker': true, + 'disabled-by-default': true, + 'always-on': true + })); + }); + + test('should reject all cookies from the notice', async ({page, context}) => { + await page.locator('.orejime-Notice-declineButton').click(); + const notice = await page.locator('.orejime-Notice'); + await expect(notice).not.toBeVisible(); + + const cookies = await context.cookies(); + const orejimeCookie = cookies.find(({name}) => name === 'orejime'); + const consents = JSON.parse(orejimeCookie!.value); + + expect(consents).toEqual(expect.objectContaining({ + 'inline-tracker': false, + 'external-tracker': false, + 'disabled-by-default': false, + 'always-on': true + })); + }); + + test('should open a modal', async ({page}) => { + await page.locator('.orejime-Notice-learnMoreButton').click(); + const notice = await page.locator('.orejime-Notice'); + await expect(notice).toBeVisible(); + + const modal = await page.locator('.orejime-Modal'); + await expect(modal).toBeVisible(); + await expect(notice).toBeVisible(); + }); + + test('should close the modal via the close button', async ({page}) => { + await page.locator('.orejime-Notice-learnMoreButton').click(); + const modal = await page.locator('.orejime-Modal'); + await expect(modal).toBeVisible(); + + await page.locator('.orejime-Modal-closeButton').click(); + await expect(modal).not.toBeVisible(); + + const notice = await page.locator('.orejime-Notice'); + await expect(notice).toBeVisible(); + }); + + test('should close the modal via the overlay', async ({page}) => { + await page.locator('.orejime-Notice-learnMoreButton').click(); + const modal = await page.locator('.orejime-Modal'); + await expect(modal).toBeVisible(); + + await page.locator('.orejime-ModalOverlay').click(); + await expect(modal).not.toBeVisible(); + + const notice = await page.locator('.orejime-Notice'); + await expect(notice).toBeVisible(); + }); + + test('should close the modal via `Escape` key', async ({page}) => { + await page.locator('.orejime-Notice-learnMoreButton').click(); + const modal = await page.locator('.orejime-Modal'); + await expect(modal).toBeVisible(); + + await page.keyboard.press('Escape'); + await expect(modal).not.toBeVisible(); + + const notice = await page.locator('.orejime-Notice'); + await expect(notice).toBeVisible(); + }); + + test('should move focus after closing the modal', async ({page}) => { + const openModalButton = await page.locator('.orejime-Notice-learnMoreButton'); + openModalButton.click(); + + const modal = await page.locator('.orejime-Modal'); + await expect(modal).toBeVisible(); + + await page.keyboard.press('Escape'); + await expect(openModalButton).toBeFocused(); + }); + + test('should accept all cookies from the modal', async ({page, context}) => { + await page.locator('.orejime-Notice-learnMoreButton').click(); + await page.locator('.orejime-AppToggles-enableAll').click(); + + const checkbox = await page.locator('#orejime-app-item-disabled-by-default'); + await expect(checkbox).toBeChecked(); + + const mandatoryCheckbox = await page.locator('#orejime-app-item-always-on'); + await expect(mandatoryCheckbox).toBeChecked(); + + await page.locator('.orejime-Modal-saveButton').click(); + const cookies = await context.cookies(); + const orejimeCookie = cookies.find(({name}) => name === 'orejime'); + const consents = JSON.parse(orejimeCookie!.value); + + expect(consents).toEqual(expect.objectContaining({ + 'inline-tracker': true, + 'external-tracker': true, + 'disabled-by-default': true, + 'always-on': true + })); + + const notice = await page.locator('.orejime-Notice'); + await expect(notice).not.toBeVisible(); + }); + + test('should reject all cookies from the modal', async ({page, context}) => { + await page.locator('.orejime-Notice-learnMoreButton').click(); + await page.locator('.orejime-AppToggles-disableAll').click(); + + const checkbox = await page.locator('#orejime-app-item-disabled-by-default'); + await expect(checkbox).not.toBeChecked(); + + const mandatoryCheckbox = await page.locator('#orejime-app-item-always-on'); + await expect(mandatoryCheckbox).toBeChecked(); + + await page.locator('.orejime-Modal-saveButton').click(); + const cookies = await context.cookies(); + const orejimeCookie = cookies.find(({name}) => name === 'orejime'); + const consents = JSON.parse(orejimeCookie!.value); + + expect(consents).toEqual(expect.objectContaining({ + 'inline-tracker': false, + 'external-tracker': false, + 'disabled-by-default': false, + 'always-on': true + })); + + const notice = await page.locator('.orejime-Notice'); + await expect(notice).not.toBeVisible(); + }); +});