From c33d4ff3e28bf94413b21d5eb0162e0a3bf89897 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bel=C3=A9n=20Albeza?= Date: Thu, 18 Apr 2024 17:36:07 +0200 Subject: [PATCH] :sparkles: Add user login front-end integration test --- frontend/playwright/example.spec.js | 2 +- .../get-built-in-templates-empty.json | 1 + .../get-font-variants-empty.json | 1 + .../logged-in-user/get-profile-logged-in.json | 23 ++++++++ .../get-profiles-for-file-comments-empty.json | 1 + .../logged-in-user/get-projects-default.json | 12 ++++ .../get-team-members-your-penpot.json | 16 ++++++ .../get-team-recent-files-empty.json | 1 + .../get-team-users-single-user.json | 1 + .../logged-in-user/get-teams-default.json | 25 +++++++++ .../get-unread-comment-threads-empty.json | 1 + .../login-with-password-success.json | 24 ++++++++ frontend/playwright/helpers/index.js | 9 +++ frontend/playwright/login.spec.js | 56 +++++++++++++++++++ 14 files changed, 172 insertions(+), 1 deletion(-) create mode 100644 frontend/playwright/fixtures/logged-in-user/get-built-in-templates-empty.json create mode 100644 frontend/playwright/fixtures/logged-in-user/get-font-variants-empty.json create mode 100644 frontend/playwright/fixtures/logged-in-user/get-profile-logged-in.json create mode 100644 frontend/playwright/fixtures/logged-in-user/get-profiles-for-file-comments-empty.json create mode 100644 frontend/playwright/fixtures/logged-in-user/get-projects-default.json create mode 100644 frontend/playwright/fixtures/logged-in-user/get-team-members-your-penpot.json create mode 100644 frontend/playwright/fixtures/logged-in-user/get-team-recent-files-empty.json create mode 100644 frontend/playwright/fixtures/logged-in-user/get-team-users-single-user.json create mode 100644 frontend/playwright/fixtures/logged-in-user/get-teams-default.json create mode 100644 frontend/playwright/fixtures/logged-in-user/get-unread-comment-threads-empty.json create mode 100644 frontend/playwright/fixtures/logged-in-user/login-with-password-success.json create mode 100644 frontend/playwright/helpers/index.js create mode 100644 frontend/playwright/login.spec.js diff --git a/frontend/playwright/example.spec.js b/frontend/playwright/example.spec.js index 1c315a71e..f2450fa36 100644 --- a/frontend/playwright/example.spec.js +++ b/frontend/playwright/example.spec.js @@ -1,6 +1,6 @@ import { test, expect } from "@playwright/test"; -test("has title", async ({ page }) => { +test("Has title", async ({ page }) => { await page.route("**/api/rpc/command/get-profile", (route) => { route.fulfill({ status: 200, diff --git a/frontend/playwright/fixtures/logged-in-user/get-built-in-templates-empty.json b/frontend/playwright/fixtures/logged-in-user/get-built-in-templates-empty.json new file mode 100644 index 000000000..0637a088a --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-built-in-templates-empty.json @@ -0,0 +1 @@ +[] \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/get-font-variants-empty.json b/frontend/playwright/fixtures/logged-in-user/get-font-variants-empty.json new file mode 100644 index 000000000..0637a088a --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-font-variants-empty.json @@ -0,0 +1 @@ +[] \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/get-profile-logged-in.json b/frontend/playwright/fixtures/logged-in-user/get-profile-logged-in.json new file mode 100644 index 000000000..8c1ae192b --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-profile-logged-in.json @@ -0,0 +1,23 @@ +{ + "~:email": "foo@example.com", + "~:is-demo": false, + "~:auth-backend": "penpot", + "~:fullname": "Princesa Leia", + "~:modified-at": "~m1713533116365", + "~:is-active": true, + "~:default-project-id": "~uc7ce0794-0992-8105-8004-38e630f7920b", + "~:id": "~uc7ce0794-0992-8105-8004-38e630f29a9b", + "~:is-muted": false, + "~:default-team-id": "~uc7ce0794-0992-8105-8004-38e630f40f6d", + "~:created-at": "~m1713533116365", + "~:is-blocked": false, + "~:props": { + "~:nudge": { + "~:big": 10, + "~:small": 1 + }, + "~:v2-info-shown": true, + "~:viewed-tutorial?": false, + "~:viewed-walkthrough?": false + } +} \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/get-profiles-for-file-comments-empty.json b/frontend/playwright/fixtures/logged-in-user/get-profiles-for-file-comments-empty.json new file mode 100644 index 000000000..0637a088a --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-profiles-for-file-comments-empty.json @@ -0,0 +1 @@ +[] \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/get-projects-default.json b/frontend/playwright/fixtures/logged-in-user/get-projects-default.json new file mode 100644 index 000000000..0d9313b1c --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-projects-default.json @@ -0,0 +1,12 @@ +[ + { + "~:id": "~uc7ce0794-0992-8105-8004-38e630f7920b", + "~:team-id": "~uc7ce0794-0992-8105-8004-38e630f40f6d", + "~:created-at": "~m1713533116382", + "~:modified-at": "~m1713533116382", + "~:is-default": true, + "~:name": "Drafts", + "~:is-pinned": false, + "~:count": 0 + } +] \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/get-team-members-your-penpot.json b/frontend/playwright/fixtures/logged-in-user/get-team-members-your-penpot.json new file mode 100644 index 000000000..3a0aa3ce7 --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-team-members-your-penpot.json @@ -0,0 +1,16 @@ +[ + { + "~:is-admin": true, + "~:email": "foo@example.com", + "~:team-id": "~uc7ce0794-0992-8105-8004-38e630f40f6d", + "~:name": "Princesa Leia", + "~:fullname": "Princesa Leia", + "~:is-owner": true, + "~:modified-at": "~m1713533116388", + "~:can-edit": true, + "~:is-active": true, + "~:id": "~uc7ce0794-0992-8105-8004-38e630f29a9b", + "~:profile-id": "~uc7ce0794-0992-8105-8004-38e630f29a9b", + "~:created-at": "~m1713533116388" + } +] \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/get-team-recent-files-empty.json b/frontend/playwright/fixtures/logged-in-user/get-team-recent-files-empty.json new file mode 100644 index 000000000..0637a088a --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-team-recent-files-empty.json @@ -0,0 +1 @@ +[] \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/get-team-users-single-user.json b/frontend/playwright/fixtures/logged-in-user/get-team-users-single-user.json new file mode 100644 index 000000000..eff03c1de --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-team-users-single-user.json @@ -0,0 +1 @@ +[{"~:id":"~uc7ce0794-0992-8105-8004-38e630f29a9b","~:fullname":"Princesa Leia"}] \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/get-teams-default.json b/frontend/playwright/fixtures/logged-in-user/get-teams-default.json new file mode 100644 index 000000000..bf8279c56 --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-teams-default.json @@ -0,0 +1,25 @@ +[ + { + "~:features": { + "~#set": [ + "layout/grid", + "styles/v2", + "fdata/pointer-map", + "fdata/objects-map", + "components/v2", + "fdata/shape-data-type" + ] + }, + "~:permissions": { + "~:type": "~:membership", + "~:is-owner": true, + "~:is-admin": true, + "~:can-edit": true + }, + "~:name": "Default", + "~:modified-at": "~m1713533116375", + "~:id": "~uc7ce0794-0992-8105-8004-38e630f40f6d", + "~:created-at": "~m1713533116375", + "~:is-default": true + } +] \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/get-unread-comment-threads-empty.json b/frontend/playwright/fixtures/logged-in-user/get-unread-comment-threads-empty.json new file mode 100644 index 000000000..0637a088a --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/get-unread-comment-threads-empty.json @@ -0,0 +1 @@ +[] \ No newline at end of file diff --git a/frontend/playwright/fixtures/logged-in-user/login-with-password-success.json b/frontend/playwright/fixtures/logged-in-user/login-with-password-success.json new file mode 100644 index 000000000..e4c1b1354 --- /dev/null +++ b/frontend/playwright/fixtures/logged-in-user/login-with-password-success.json @@ -0,0 +1,24 @@ +{ + "~:is-admin": false, + "~:email": "foo@example.com", + "~:is-demo": false, + "~:auth-backend": "penpot", + "~:fullname": "Princesa Leia", + "~:modified-at": "~m1713533116365", + "~:is-active": true, + "~:default-project-id": "~uc7ce0794-0992-8105-8004-38e630f7920b", + "~:id": "~uc7ce0794-0992-8105-8004-38e630f29a9b", + "~:is-muted": false, + "~:default-team-id": "~uc7ce0794-0992-8105-8004-38e630f40f6d", + "~:created-at": "~m1713533116365", + "~:is-blocked": false, + "~:props": { + "~:nudge": { + "~:big": 10, + "~:small": 1 + }, + "~:v2-info-shown": true, + "~:viewed-tutorial?": false, + "~:viewed-walkthrough?": false + } +} \ No newline at end of file diff --git a/frontend/playwright/helpers/index.js b/frontend/playwright/helpers/index.js new file mode 100644 index 000000000..50f7e5487 --- /dev/null +++ b/frontend/playwright/helpers/index.js @@ -0,0 +1,9 @@ +export const interceptRPC = async (page, path, jsonFilename) => { + await page.route(`**/api/rpc/command/${path}`, (route) => { + route.fulfill({ + status: 200, + contentType: "application/transit+json", + path: `playwright/fixtures/${jsonFilename}`, + }); + }); +}; diff --git a/frontend/playwright/login.spec.js b/frontend/playwright/login.spec.js new file mode 100644 index 000000000..5463a74f2 --- /dev/null +++ b/frontend/playwright/login.spec.js @@ -0,0 +1,56 @@ +import { test, expect } from "@playwright/test"; +import { interceptRPC } from "./helpers"; + +const setupLoggedOutUser = async (page) => { + await interceptRPC(page, "get-profile", "get-profile-anonymous.json"); + await interceptRPC(page, "login-with-password", "logged-in-user/login-with-password-success.json"); +}; + +// TODO: maybe Playwright's fixtures are the right way to do this? +const setupDashboardUser = async (page) => { + await interceptRPC(page, "get-profile", "logged-in-user/get-profile-logged-in.json"); + await interceptRPC(page, "get-teams", "logged-in-user/get-teams-default.json"); + await interceptRPC(page, "get-font-variants?team-id=*", "logged-in-user/get-font-variants-empty.json"); + await interceptRPC(page, "get-projects?team-id=*", "logged-in-user/get-projects-default.json"); + await interceptRPC(page, "get-team-members?team-id=*", "logged-in-user/get-team-members-your-penpot.json"); + await interceptRPC(page, "get-team-users?team-id=*", "logged-in-user/get-team-users-single-user.json"); + await interceptRPC( + page, + "get-unread-comment-threads?team-id=*", + "logged-in-user/get-team-users-single-user.json", + ); + await interceptRPC( + page, + "get-team-recent-files?team-id=*", + "logged-in-user/get-team-recent-files-empty.json", + ); + await interceptRPC( + page, + "get-profiles-for-file-comments", + "logged-in-user/get-profiles-for-file-comments-empty.json", + ); +}; + +test("Shows login page when going to index and user is logged out", async ({ page }) => { + setupLoggedOutUser(page); + + await page.goto("/"); + + await expect(page).toHaveURL(/auth\/login$/); + await expect(page.getByText("Log into my account")).toBeVisible(); +}); + +test("User logs in by filling the login form", async ({ page }) => { + setupLoggedOutUser(page); + + await page.goto("/#/auth/login"); + + setupDashboardUser(page); + + await page.getByLabel("Email").fill("foo@example.com"); + await page.getByLabel("Password").fill("loremipsum"); + + await page.getByRole("button", { name: "Login" }).click(); + + await expect(page).toHaveURL(/dashboard/); +});