From a74e786da2898885898a67d278d2f6e903a60164 Mon Sep 17 00:00:00 2001 From: Lint Action Date: Mon, 14 Apr 2025 07:07:06 +0000 Subject: [PATCH] style: fix linting issues met Prettier --- frontend/e2e/basic-homepage.spec.ts | 114 +++++++++++++------------- frontend/e2e/basic-learning.spec.ts | 16 ++-- frontend/e2e/basic-learning.ts | 6 +- frontend/e2e/fixtures.ts | 119 ++++++++++++++-------------- frontend/playwright.config.ts | 20 ++--- 5 files changed, 139 insertions(+), 136 deletions(-) diff --git a/frontend/e2e/basic-homepage.spec.ts b/frontend/e2e/basic-homepage.spec.ts index 6ea6c78b..94dd685a 100644 --- a/frontend/e2e/basic-homepage.spec.ts +++ b/frontend/e2e/basic-homepage.spec.ts @@ -1,82 +1,82 @@ -import { test, expect } from '@playwright/test'; +import { test, expect } from "@playwright/test"; -test('User can pick their language', async ({ page }) => { - await page.goto('/'); +test("User can pick their language", async ({ page }) => { + await page.goto("/"); - await expect(page.getByRole('button', { name: 'translate' })).toBeVisible(); - await page.getByRole('button', { name: 'translate' }).click(); - await page.getByText('Nederlands').click(); - await expect(page.locator('h1')).toContainText('Onze sterke punten'); - await expect(page.getByRole('heading', { name: 'Innovatief' })).toBeVisible(); + await expect(page.getByRole("button", { name: "translate" })).toBeVisible(); + await page.getByRole("button", { name: "translate" }).click(); + await page.getByText("Nederlands").click(); + await expect(page.locator("h1")).toContainText("Onze sterke punten"); + await expect(page.getByRole("heading", { name: "Innovatief" })).toBeVisible(); - await expect(page.getByRole('button', { name: 'vertalen' })).toBeVisible(); - await page.getByRole('button', { name: 'vertalen' }).click(); - await page.getByText('English').click(); - await expect(page.locator('h1')).toContainText('Our strengths'); - await expect(page.getByRole('heading', { name: 'Innovative' })).toBeVisible(); + await expect(page.getByRole("button", { name: "vertalen" })).toBeVisible(); + await page.getByRole("button", { name: "vertalen" }).click(); + await page.getByText("English").click(); + await expect(page.locator("h1")).toContainText("Our strengths"); + await expect(page.getByRole("heading", { name: "Innovative" })).toBeVisible(); }); -test('Teacher can sign in', async ({ page }) => { - await page.goto('/'); - await expect(page.getByRole('link', { name: 'log in' })).toBeVisible(); - await page.getByRole('link', { name: 'log in' }).click(); +test("Teacher can sign in", async ({ page }) => { + await page.goto("/"); + await expect(page.getByRole("link", { name: "log in" })).toBeVisible(); + await page.getByRole("link", { name: "log in" }).click(); - await expect(page.getByRole('button', { name: 'teacher' })).toBeVisible(); - await page.getByRole('button', { name: 'teacher' }).click(); + await expect(page.getByRole("button", { name: "teacher" })).toBeVisible(); + await page.getByRole("button", { name: "teacher" }).click(); - await expect(page.getByText('teacher')).toBeVisible(); - await expect(page.getByRole('button', { name: 'Sign In' })).toBeVisible(); + await expect(page.getByText("teacher")).toBeVisible(); + await expect(page.getByRole("button", { name: "Sign In" })).toBeVisible(); await expect(page).toHaveURL(/\/realms\/teacher\//); - await page.getByRole('textbox', { name: 'Username or email' }).fill('testleerkracht1'); - await page.getByRole('textbox', { name: 'Password' }).fill('password'); - await page.getByRole('button', { name: 'Sign In' }).click(); + await page.getByRole("textbox", { name: "Username or email" }).fill("testleerkracht1"); + await page.getByRole("textbox", { name: "Password" }).fill("password"); + await page.getByRole("button", { name: "Sign In" }).click(); - await expect(page.getByRole('link', { name: 'Dwengo logo teacher' })).toBeVisible(); - await expect(page.getByRole('button').nth(1)).toBeVisible(); + await expect(page.getByRole("link", { name: "Dwengo logo teacher" })).toBeVisible(); + await expect(page.getByRole("button").nth(1)).toBeVisible(); }); -test('Student can sign in', async ({ page }) => { - await page.goto('/'); - await expect(page.getByRole('link', { name: 'log in' })).toBeVisible(); - await page.getByRole('link', { name: 'log in' }).click(); +test("Student can sign in", async ({ page }) => { + await page.goto("/"); + await expect(page.getByRole("link", { name: "log in" })).toBeVisible(); + await page.getByRole("link", { name: "log in" }).click(); - await expect(page.getByRole('button', { name: 'student' })).toBeVisible(); - await page.getByRole('button', { name: 'student' }).click(); + await expect(page.getByRole("button", { name: "student" })).toBeVisible(); + await page.getByRole("button", { name: "student" }).click(); await expect(page).toHaveURL(/\/realms\/student\//); - await expect(page.getByText('student')).toBeVisible(); - await expect(page.getByRole('button', { name: 'Sign In' })).toBeVisible(); + await expect(page.getByText("student")).toBeVisible(); + await expect(page.getByRole("button", { name: "Sign In" })).toBeVisible(); - await page.getByRole('textbox', { name: 'Username or email' }).fill('testleerling1'); - await page.getByRole('textbox', { name: 'Password' }).fill('password'); - await page.getByRole('button', { name: 'Sign In' }).click(); + await page.getByRole("textbox", { name: "Username or email" }).fill("testleerling1"); + await page.getByRole("textbox", { name: "Password" }).fill("password"); + await page.getByRole("button", { name: "Sign In" }).click(); - await expect(page.getByRole('link', { name: 'Dwengo logo student' })).toBeVisible(); - await expect(page.getByRole('button').nth(1)).toBeVisible(); + await expect(page.getByRole("link", { name: "Dwengo logo student" })).toBeVisible(); + await expect(page.getByRole("button").nth(1)).toBeVisible(); }); -test('Cannot sign in with invalid credentials', async ({ page }) => { - await page.goto('/'); - await page.getByRole('link', { name: 'log in' }).click(); - await page.getByRole('button', { name: 'teacher' }).click(); - await page.getByRole('textbox', { name: 'Username or email' }).fill('doesnotexist'); - await page.getByRole('textbox', { name: 'Password' }).fill('wrong'); - await page.getByRole('button', { name: 'Sign In' }).click(); - await expect(page.getByText('Invalid username or password.')).toBeVisible(); +test("Cannot sign in with invalid credentials", async ({ page }) => { + await page.goto("/"); + await page.getByRole("link", { name: "log in" }).click(); + await page.getByRole("button", { name: "teacher" }).click(); + await page.getByRole("textbox", { name: "Username or email" }).fill("doesnotexist"); + await page.getByRole("textbox", { name: "Password" }).fill("wrong"); + await page.getByRole("button", { name: "Sign In" }).click(); + await expect(page.getByText("Invalid username or password.")).toBeVisible(); - await page.goto('/'); - await page.getByRole('link', { name: 'log in' }).click(); - await page.getByRole('button', { name: 'student' }).click(); - await page.getByRole('textbox', { name: 'Username or email' }).fill('doesnotexist'); - await page.getByRole('textbox', { name: 'Password' }).fill('wrong'); - await page.getByRole('button', { name: 'Sign In' }).click(); - await expect(page.getByText('Invalid username or password.')).toBeVisible(); + await page.goto("/"); + await page.getByRole("link", { name: "log in" }).click(); + await page.getByRole("button", { name: "student" }).click(); + await page.getByRole("textbox", { name: "Username or email" }).fill("doesnotexist"); + await page.getByRole("textbox", { name: "Password" }).fill("wrong"); + await page.getByRole("button", { name: "Sign In" }).click(); + await expect(page.getByText("Invalid username or password.")).toBeVisible(); }); -test('Cannot skip login', async ({ page }) => { - await page.goto('/user'); - await expect(page.getByRole('link', { name: 'log in' })).toBeVisible(); +test("Cannot skip login", async ({ page }) => { + await page.goto("/user"); + await expect(page.getByRole("link", { name: "log in" })).toBeVisible(); }); diff --git a/frontend/e2e/basic-learning.spec.ts b/frontend/e2e/basic-learning.spec.ts index 3fcad492..f7438454 100644 --- a/frontend/e2e/basic-learning.spec.ts +++ b/frontend/e2e/basic-learning.spec.ts @@ -1,12 +1,12 @@ -import { test, expect } from './fixtures.js'; +import { test, expect } from "./fixtures.js"; -test('Users can filter', async ({ page }) => { - await page.goto('/user'); +test("Users can filter", async ({ page }) => { + await page.goto("/user"); - await page.getByRole('combobox').filter({ hasText: 'Select a themeAll' }).locator('i').click(); - await page.getByText('Nature and climate').click(); - await page.getByRole('combobox').filter({ hasText: 'Select ageAll agesSelect age' }).locator('i').click(); - await page.getByText('and older').click(); + await page.getByRole("combobox").filter({ hasText: "Select a themeAll" }).locator("i").click(); + await page.getByText("Nature and climate").click(); + await page.getByRole("combobox").filter({ hasText: "Select ageAll agesSelect age" }).locator("i").click(); + await page.getByText("and older").click(); - await expect(page.getByRole('link', { name: 'AI and Climate Students in' })).toBeVisible(); + await expect(page.getByRole("link", { name: "AI and Climate Students in" })).toBeVisible(); }); diff --git a/frontend/e2e/basic-learning.ts b/frontend/e2e/basic-learning.ts index 45851236..157debb0 100644 --- a/frontend/e2e/basic-learning.ts +++ b/frontend/e2e/basic-learning.ts @@ -1,5 +1,5 @@ -import { test, expect } from './fixtures.js'; +import { test, expect } from "./fixtures.js"; -test('myTest', async ({ page }) => { - await expect(page).toHaveURL('/'); +test("myTest", async ({ page }) => { + await expect(page).toHaveURL("/"); }); diff --git a/frontend/e2e/fixtures.ts b/frontend/e2e/fixtures.ts index 7035bfad..33bdc848 100644 --- a/frontend/e2e/fixtures.ts +++ b/frontend/e2e/fixtures.ts @@ -1,14 +1,14 @@ /* eslint-disable no-await-in-loop */ // eslint-disable-next-line @typescript-eslint/no-unused-vars -import { test as baseTest, expect } from '@playwright/test'; -import type { Browser } from 'playwright-core'; -import fs from 'fs'; -import path from 'path'; +import { test as baseTest, expect } from "@playwright/test"; +import type { Browser } from "playwright-core"; +import fs from "fs"; +import path from "path"; /* Based on https://playwright.dev/docs/auth#moderate-one-account-per-parallel-worker */ -export * from '@playwright/test'; -export const ROOT_URL = 'http://localhost:5173'; +export * from "@playwright/test"; +export const ROOT_URL = "http://localhost:5173"; interface Account { username: string; @@ -23,40 +23,40 @@ interface Account { async function acquireAccount(id: number, browser: Browser): Promise { const account = { username: `worker${id}`, - password: 'password', - } + password: "password", + }; const page = await browser.newPage(); await page.goto(ROOT_URL); - await page.getByRole('link', { name: 'log in' }).click(); - await page.getByRole('button', { name: 'student' }).click(); + await page.getByRole("link", { name: "log in" }).click(); + await page.getByRole("button", { name: "student" }).click(); - await page.getByRole('textbox', { name: 'Username' }).fill(account.username); - await page.getByRole('textbox', { name: 'Password', exact: true }).fill(account.password); - await page.getByRole('button', { name: 'Sign In' }).click(); + await page.getByRole("textbox", { name: "Username" }).fill(account.username); + await page.getByRole("textbox", { name: "Password", exact: true }).fill(account.password); + await page.getByRole("button", { name: "Sign In" }).click(); - let failed = await page.getByText('Invalid username or password.').isVisible(); + let failed = await page.getByText("Invalid username or password.").isVisible(); if (failed) { - await page.getByRole('link', { name: 'Register' }).click(); + await page.getByRole("link", { name: "Register" }).click(); } while (failed) { // Retry with a different username, based on Unix timestamp. account.username = `worker${id}-${Date.now()}`; - await page.getByRole('textbox', { name: 'Username' }).fill(account.username); - await page.getByRole('textbox', { name: 'Password', exact: true }).fill(account.password); - await page.getByRole('textbox', { name: 'Confirm password' }).fill(account.password); - await page.getByRole('textbox', { name: 'Email' }).fill(`${account.username}@dwengo.org`); - await page.getByRole('textbox', { name: 'First name' }).fill('Worker'); - await page.getByRole('textbox', { name: 'Last name' }).fill(id.toString()); - await page.getByRole('button', { name: 'Register' }).click(); + await page.getByRole("textbox", { name: "Username" }).fill(account.username); + await page.getByRole("textbox", { name: "Password", exact: true }).fill(account.password); + await page.getByRole("textbox", { name: "Confirm password" }).fill(account.password); + await page.getByRole("textbox", { name: "Email" }).fill(`${account.username}@dwengo.org`); + await page.getByRole("textbox", { name: "First name" }).fill("Worker"); + await page.getByRole("textbox", { name: "Last name" }).fill(id.toString()); + await page.getByRole("button", { name: "Register" }).click(); await page.waitForURL(/localhost/); - failed = await page.getByText('Username already exists.').isVisible(); + failed = await page.getByText("Username already exists.").isVisible(); } await page.waitForURL(/localhost/); @@ -70,41 +70,44 @@ export const test = baseTest.extend({ storageState: async ({ workerStorageState }, use) => use(workerStorageState), // Authenticate once per worker with a worker-scoped fixture. - workerStorageState: [async ({ browser }, use): Promise => { - // Use parallelIndex as a unique identifier for each worker. - const id = test.info().parallelIndex; - const fileName = path.resolve(test.info().project.outputDir, `.auth/${id}.json`); + workerStorageState: [ + async ({ browser }, use): Promise => { + // Use parallelIndex as a unique identifier for each worker. + const id = test.info().parallelIndex; + const fileName = path.resolve(test.info().project.outputDir, `.auth/${id}.json`); - if (fs.existsSync(fileName)) { - // Reuse existing authentication state if any. + if (fs.existsSync(fileName)) { + // Reuse existing authentication state if any. + await use(fileName); + return; + } + + // Important: make sure we authenticate in a clean environment by unsetting storage state. + const page = await browser.newPage({ storageState: undefined }); + + // Acquire a unique account by creating a new one. + const account = await acquireAccount(id, browser); + + // Perform authentication steps. Replace these actions with your own. + await page.goto(ROOT_URL); + await page.getByRole("link", { name: "log in" }).click(); + await page.getByRole("button", { name: "student" }).click(); + await page.getByRole("textbox", { name: "Username or email" }).fill(account.username); + await page.getByRole("textbox", { name: "Password" }).fill(account.password); + await page.getByRole("button", { name: "Sign In" }).click(); + // Wait until the page receives the cookies. + // + // Sometimes login flow sets cookies in the process of several redirects. + // Wait for the final URL to ensure that the cookies are actually set. + await page.waitForLoadState("domcontentloaded"); + // Alternatively, you can wait until the page reaches a state where all cookies are set. + + // End of authentication steps. + + await page.context().storageState({ path: fileName }); + await page.close(); await use(fileName); - return; - } - - // Important: make sure we authenticate in a clean environment by unsetting storage state. - const page = await browser.newPage({ storageState: undefined }); - - // Acquire a unique account by creating a new one. - const account = await acquireAccount(id, browser); - - // Perform authentication steps. Replace these actions with your own. - await page.goto(ROOT_URL); - await page.getByRole('link', { name: 'log in' }).click(); - await page.getByRole('button', { name: 'student' }).click(); - await page.getByRole('textbox', { name: 'Username or email' }).fill(account.username); - await page.getByRole('textbox', { name: 'Password' }).fill(account.password); - await page.getByRole('button', { name: 'Sign In' }).click(); - // Wait until the page receives the cookies. - // - // Sometimes login flow sets cookies in the process of several redirects. - // Wait for the final URL to ensure that the cookies are actually set. - await page.waitForLoadState("domcontentloaded"); - // Alternatively, you can wait until the page reaches a state where all cookies are set. - - // End of authentication steps. - - await page.context().storageState({ path: fileName }); - await page.close(); - await use(fileName); - }, { scope: 'worker' }], + }, + { scope: "worker" }, + ], }); diff --git a/frontend/playwright.config.ts b/frontend/playwright.config.ts index 858d22e0..edf774cf 100644 --- a/frontend/playwright.config.ts +++ b/frontend/playwright.config.ts @@ -66,16 +66,16 @@ export default defineConfig({ /* Test against mobile viewports. */ { - name: 'Mobile Chrome', - use: { - ...devices['Pixel 5'], - }, + name: "Mobile Chrome", + use: { + ...devices["Pixel 5"], + }, }, { - name: 'Mobile Safari', - use: { - ...devices['iPhone 12'], - }, + name: "Mobile Safari", + use: { + ...devices["iPhone 12"], + }, }, /* Test against branded browsers. */ @@ -109,7 +109,7 @@ export default defineConfig({ gracefulShutdown: { signal: "SIGTERM", timeout: 5000, - } + }, }, { command: process.env.CI ? "cd ../ && npm run dev -w backend" : "cd ../ && npm run start -w backend", @@ -119,6 +119,6 @@ export default defineConfig({ { command: "wait-on http://localhost:7080", timeout: 120000, - } + }, ], });