diff --git a/frontend/playwright/ui/visual-specs/example.spec.js b/frontend/playwright/ui/visual-specs/example.spec.js deleted file mode 100644 index e4c344eec..000000000 --- a/frontend/playwright/ui/visual-specs/example.spec.js +++ /dev/null @@ -1,10 +0,0 @@ -import { test, expect } from "@playwright/test"; -import { LoginPage } from "../pages/LoginPage"; - -test("Shows login form correctly", async ({ page }) => { - await LoginPage.initWithLoggedOutUser(page); - const loginPage = new LoginPage(page); - await page.goto("/#/auth/login"); - - await expect(page).toHaveScreenshot(); -}); diff --git a/frontend/playwright/ui/visual-specs/visual-login.spec.js b/frontend/playwright/ui/visual-specs/visual-login.spec.js new file mode 100644 index 000000000..b3b63a0c5 --- /dev/null +++ b/frontend/playwright/ui/visual-specs/visual-login.spec.js @@ -0,0 +1,37 @@ +import { test, expect } from "@playwright/test"; +import { LoginPage } from "../pages/LoginPage"; + +test.beforeEach(async ({ page }) => { + const login = new LoginPage(page); + await login.initWithLoggedOutUser(); + await login.page.goto("/#/auth/login"); +}); + +test.describe("Login form", () => { + test("Shows the login form correctly", async ({ page }) => { + const login = new LoginPage(page); + await expect(login.page).toHaveScreenshot(); + }); + + test("Shows form error messages correctly ", async ({ page }) => { + const login = new LoginPage(page); + await login.setupLoginSuccess(); + + await login.fillEmailAndPasswordInputs("foo", "lorenIpsum"); + + await expect(login.invalidEmailError).toBeVisible(); + await expect(login.page).toHaveScreenshot(); + }); + + test("Shows error toasts correctly", async ({ page }) => { + const login = new LoginPage(page); + await login.setupLoginError(); + + await login.fillEmailAndPasswordInputs("test@example.com", "loremipsum"); + await login.clickLoginButton(); + + await expect(login.invalidCredentialsError).toBeVisible(); + await expect(login.page).toHaveURL(/auth\/login$/); + await expect(login.page).toHaveScreenshot(); + }); +});