From 0091ac0f5f26971304567b134b5bd8907d1f1165 Mon Sep 17 00:00:00 2001 From: AzazelN28 Date: Tue, 7 May 2024 13:12:58 +0200 Subject: [PATCH] :recycle: Refactor tests and pages --- .../workspace/get-comment-threads-empty.json | 0 .../workspace/get-file-blank.json | 0 .../workspace/get-file-fragment-blank.json | 0 .../workspace/get-file-libraries-empty.json | 0 .../get-file-object-thumbnails-blank.json | 0 .../workspace/get-font-variants-empty.json | 0 .../get-profile-for-file-comments.json | 0 .../workspace/get-project-default.json | 0 .../workspace/get-team-default.json | 0 .../workspace/ws-notifications.js | 0 frontend/playwright/fixtures/login-fixture.js | 10 +++ frontend/playwright/helpers/MockAPI.js | 17 ----- ...ockWebSocket.js => MockWebSocketHelper.js} | 14 ++-- frontend/playwright/helpers/intercepts.js | 8 -- frontend/playwright/login.spec.js | 57 -------------- frontend/playwright/scripts/MockWebSocket.js | 5 -- frontend/playwright/ui/pages/BasePage.js | 38 ++++++++++ .../playwright/ui/pages/BaseWebSocketPage.js | 32 ++++++++ frontend/playwright/ui/pages/LoginPage.js | 54 +++++++++++++ frontend/playwright/ui/pages/login-page.js | 76 ------------------- frontend/playwright/ui/specs/login.spec.js | 13 ++-- .../playwright/ui/specs/workspace.spec.js | 54 +++++++++++++ frontend/playwright/workspace.spec.js | 76 ------------------- .../main/data/workspace/notifications.cljs | 1 - 24 files changed, 201 insertions(+), 254 deletions(-) rename frontend/playwright/{fixtures => data}/workspace/get-comment-threads-empty.json (100%) rename frontend/playwright/{fixtures => data}/workspace/get-file-blank.json (100%) rename frontend/playwright/{fixtures => data}/workspace/get-file-fragment-blank.json (100%) rename frontend/playwright/{fixtures => data}/workspace/get-file-libraries-empty.json (100%) rename frontend/playwright/{fixtures => data}/workspace/get-file-object-thumbnails-blank.json (100%) rename frontend/playwright/{fixtures => data}/workspace/get-font-variants-empty.json (100%) rename frontend/playwright/{fixtures => data}/workspace/get-profile-for-file-comments.json (100%) rename frontend/playwright/{fixtures => data}/workspace/get-project-default.json (100%) rename frontend/playwright/{fixtures => data}/workspace/get-team-default.json (100%) rename frontend/playwright/{fixtures => data}/workspace/ws-notifications.js (100%) create mode 100644 frontend/playwright/fixtures/login-fixture.js delete mode 100644 frontend/playwright/helpers/MockAPI.js rename frontend/playwright/helpers/{MockWebSocket.js => MockWebSocketHelper.js} (85%) delete mode 100644 frontend/playwright/helpers/intercepts.js delete mode 100644 frontend/playwright/login.spec.js create mode 100644 frontend/playwright/ui/pages/BasePage.js create mode 100644 frontend/playwright/ui/pages/BaseWebSocketPage.js create mode 100644 frontend/playwright/ui/pages/LoginPage.js delete mode 100644 frontend/playwright/ui/pages/login-page.js create mode 100644 frontend/playwright/ui/specs/workspace.spec.js delete mode 100644 frontend/playwright/workspace.spec.js diff --git a/frontend/playwright/fixtures/workspace/get-comment-threads-empty.json b/frontend/playwright/data/workspace/get-comment-threads-empty.json similarity index 100% rename from frontend/playwright/fixtures/workspace/get-comment-threads-empty.json rename to frontend/playwright/data/workspace/get-comment-threads-empty.json diff --git a/frontend/playwright/fixtures/workspace/get-file-blank.json b/frontend/playwright/data/workspace/get-file-blank.json similarity index 100% rename from frontend/playwright/fixtures/workspace/get-file-blank.json rename to frontend/playwright/data/workspace/get-file-blank.json diff --git a/frontend/playwright/fixtures/workspace/get-file-fragment-blank.json b/frontend/playwright/data/workspace/get-file-fragment-blank.json similarity index 100% rename from frontend/playwright/fixtures/workspace/get-file-fragment-blank.json rename to frontend/playwright/data/workspace/get-file-fragment-blank.json diff --git a/frontend/playwright/fixtures/workspace/get-file-libraries-empty.json b/frontend/playwright/data/workspace/get-file-libraries-empty.json similarity index 100% rename from frontend/playwright/fixtures/workspace/get-file-libraries-empty.json rename to frontend/playwright/data/workspace/get-file-libraries-empty.json diff --git a/frontend/playwright/fixtures/workspace/get-file-object-thumbnails-blank.json b/frontend/playwright/data/workspace/get-file-object-thumbnails-blank.json similarity index 100% rename from frontend/playwright/fixtures/workspace/get-file-object-thumbnails-blank.json rename to frontend/playwright/data/workspace/get-file-object-thumbnails-blank.json diff --git a/frontend/playwright/fixtures/workspace/get-font-variants-empty.json b/frontend/playwright/data/workspace/get-font-variants-empty.json similarity index 100% rename from frontend/playwright/fixtures/workspace/get-font-variants-empty.json rename to frontend/playwright/data/workspace/get-font-variants-empty.json diff --git a/frontend/playwright/fixtures/workspace/get-profile-for-file-comments.json b/frontend/playwright/data/workspace/get-profile-for-file-comments.json similarity index 100% rename from frontend/playwright/fixtures/workspace/get-profile-for-file-comments.json rename to frontend/playwright/data/workspace/get-profile-for-file-comments.json diff --git a/frontend/playwright/fixtures/workspace/get-project-default.json b/frontend/playwright/data/workspace/get-project-default.json similarity index 100% rename from frontend/playwright/fixtures/workspace/get-project-default.json rename to frontend/playwright/data/workspace/get-project-default.json diff --git a/frontend/playwright/fixtures/workspace/get-team-default.json b/frontend/playwright/data/workspace/get-team-default.json similarity index 100% rename from frontend/playwright/fixtures/workspace/get-team-default.json rename to frontend/playwright/data/workspace/get-team-default.json diff --git a/frontend/playwright/fixtures/workspace/ws-notifications.js b/frontend/playwright/data/workspace/ws-notifications.js similarity index 100% rename from frontend/playwright/fixtures/workspace/ws-notifications.js rename to frontend/playwright/data/workspace/ws-notifications.js diff --git a/frontend/playwright/fixtures/login-fixture.js b/frontend/playwright/fixtures/login-fixture.js new file mode 100644 index 000000000..866453793 --- /dev/null +++ b/frontend/playwright/fixtures/login-fixture.js @@ -0,0 +1,10 @@ +import { test as base } from '@playwright/test' + +export const test = base.extend({ + loginPage: async ({ page }, use) => { + const loginPage = new LoginPage(page) + await use(loginPage) + } +}) + +export { expect } from '@playwright/test' diff --git a/frontend/playwright/helpers/MockAPI.js b/frontend/playwright/helpers/MockAPI.js deleted file mode 100644 index 8a5e970c4..000000000 --- a/frontend/playwright/helpers/MockAPI.js +++ /dev/null @@ -1,17 +0,0 @@ -export const interceptRPC = (page, path, jsonFilename) => - page.route(`**/api/rpc/command/${path}`, (route) => - route.fulfill({ - status: 200, - contentType: "application/transit+json", - path: `playwright/fixtures/${jsonFilename}`, - }), - ); - -export const interceptRPCByRegex = (page, regex, jsonFilename) => - page.route(regex, (route) => - route.fulfill({ - status: 200, - contentType: "application/transit+json", - path: `playwright/fixtures/${jsonFilename}`, - }), - ); diff --git a/frontend/playwright/helpers/MockWebSocket.js b/frontend/playwright/helpers/MockWebSocketHelper.js similarity index 85% rename from frontend/playwright/helpers/MockWebSocket.js rename to frontend/playwright/helpers/MockWebSocketHelper.js index 1a6c8eb81..3f0f845d2 100644 --- a/frontend/playwright/helpers/MockWebSocket.js +++ b/frontend/playwright/helpers/MockWebSocketHelper.js @@ -1,18 +1,21 @@ -export class MockWebSocket extends EventTarget { +export class MockWebSocketHelper extends EventTarget { static #mocks = new Map(); static async init(page) { await page.exposeFunction("MockWebSocket$$constructor", (url, protocols) => { - console.log("MockWebSocket$$constructor", MockWebSocket, url, protocols); - const webSocket = new MockWebSocket(page, url, protocols); + const webSocket = new MockWebSocketHelper(page, url, protocols); this.#mocks.set(url, webSocket); }); await page.exposeFunction("MockWebSocket$$spyMessage", (url, data) => { - console.log("MockWebSocket$$spyMessage", url, data); + if (!this.#mocks.has(url)) { + throw new Error(`WebSocket with URL ${url} not found`); + } this.#mocks.get(url).dispatchEvent(new MessageEvent("message", { data })); }); await page.exposeFunction("MockWebSocket$$spyClose", (url, code, reason) => { - console.log("MockWebSocket$$spyClose", url, code, reason); + if (!this.#mocks.has(url)) { + throw new Error(`WebSocket with URL ${url} not found`); + } this.#mocks.get(url).dispatchEvent(new CloseEvent("close", { code, reason })); }); await page.addInitScript({ path: "playwright/scripts/MockWebSocket.js" }); @@ -22,7 +25,6 @@ export class MockWebSocket extends EventTarget { return new Promise((resolve) => { const intervalID = setInterval(() => { for (const [wsURL, ws] of this.#mocks) { - console.log('waitForURL', wsURL); if (wsURL.includes(url)) { clearInterval(intervalID); return resolve(ws); diff --git a/frontend/playwright/helpers/intercepts.js b/frontend/playwright/helpers/intercepts.js deleted file mode 100644 index ecb46b817..000000000 --- a/frontend/playwright/helpers/intercepts.js +++ /dev/null @@ -1,8 +0,0 @@ -import { interceptRPC } from "./index"; - - -export const setupNotLogedIn = async (page) => { - await interceptRPC(page, "get-profile", "get-profile-anonymous.json"); - -}; - diff --git a/frontend/playwright/login.spec.js b/frontend/playwright/login.spec.js deleted file mode 100644 index cade62385..000000000 --- a/frontend/playwright/login.spec.js +++ /dev/null @@ -1,57 +0,0 @@ -import { test, expect } from "@playwright/test"; -import { interceptRPC } from "./helpers/MockAPI"; - -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", - ); - await interceptRPC(page, "get-builtin-templates", "logged-in-user/get-builtin-templates-empty.json"); -}; - -test("Shows login page when going to index and user is logged out", async ({ page }) => { - await 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 }) => { - await setupLoggedOutUser(page); - - await page.goto("/#/auth/login"); - - await 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/); -}); diff --git a/frontend/playwright/scripts/MockWebSocket.js b/frontend/playwright/scripts/MockWebSocket.js index 60723eb29..b7f5e4e30 100644 --- a/frontend/playwright/scripts/MockWebSocket.js +++ b/frontend/playwright/scripts/MockWebSocket.js @@ -39,7 +39,6 @@ window.WebSocket = class MockWebSocket extends EventTarget { #spyClose = null; constructor(url, protocols) { - console.log("🤖 New websocket at", url); super(); this.#url = url; @@ -166,7 +165,6 @@ window.WebSocket = class MockWebSocket extends EventTarget { } mockOpen(options) { - console.log("🤖 open mock"); this.#protocol = options?.protocol || ""; this.#extensions = options?.extensions || ""; this.#readyState = MockWebSocket.OPEN; @@ -181,12 +179,9 @@ window.WebSocket = class MockWebSocket extends EventTarget { } mockMessage(data) { - console.log("🤯 mock message"); if (this.#readyState !== MockWebSocket.OPEN) { - console.log("socket is not connected"); throw new Error("MockWebSocket is not connected"); } - console.log("😰 dispatching `message`", { data }); this.dispatchEvent(new MessageEvent("message", { data })); return this; } diff --git a/frontend/playwright/ui/pages/BasePage.js b/frontend/playwright/ui/pages/BasePage.js new file mode 100644 index 000000000..e0e62a0a1 --- /dev/null +++ b/frontend/playwright/ui/pages/BasePage.js @@ -0,0 +1,38 @@ +export class BasePage { + static async mockRPC(page, path, jsonFilename, options) { + if (!page) { + throw new TypeError("Invalid page argument. Must be a Playwright page."); + } + if (typeof path !== "string" && !(path instanceof RegExp)) { + throw new TypeError("Invalid path argument. Must be a string or a RegExp."); + } + const url = typeof path === "string" ? `**/api/rpc/command/${path}` : path; + const interceptConfig = { + status: 200, + contentType: "application/transit+json", + ...options, + }; + return page.route(url, (route) => + route.fulfill({ + ...interceptConfig, + path: `playwright/data/${jsonFilename}`, + }), + ); + } + + #page = null; + + constructor(page) { + this.#page = page; + } + + get page() { + return this.#page; + } + + async mockRPC(path, jsonFilename, options) { + return BasePage.mockRPC(this.page, path, jsonFilename, options); + } +} + +export default BasePage; diff --git a/frontend/playwright/ui/pages/BaseWebSocketPage.js b/frontend/playwright/ui/pages/BaseWebSocketPage.js new file mode 100644 index 000000000..f76a7f5c4 --- /dev/null +++ b/frontend/playwright/ui/pages/BaseWebSocketPage.js @@ -0,0 +1,32 @@ +import { MockWebSocketHelper } from "../../helpers/MockWebSocketHelper"; +import BasePage from "./BasePage"; + +export class BaseWebSocketPage extends BasePage { + /** + * This should be called on `test.beforeEach`. + * + * @param {Page} page + * @returns + */ + static setupWebSockets(page) { + return MockWebSocketHelper.init(page); + } + + /** + * Returns a promise that resolves when a WebSocket with the given URL is created. + * + * @param {string} url + * @returns {Promise} + */ + async waitForWebSocket(url) { + return MockWebSocketHelper.waitForURL(url); + } + + /** + * + * @returns {Promise} + */ + async waitForNotificationsWebSocket() { + return this.waitForWebSocket("ws://0.0.0.0:3500/ws/notifications"); + } +} diff --git a/frontend/playwright/ui/pages/LoginPage.js b/frontend/playwright/ui/pages/LoginPage.js new file mode 100644 index 000000000..e0acf8b12 --- /dev/null +++ b/frontend/playwright/ui/pages/LoginPage.js @@ -0,0 +1,54 @@ +import { BasePage } from "./BasePage"; + +export class LoginPage extends BasePage { + static setupLoggedOutUser(page) { + return this.mockRPC(page, "get-profile", "get-profile-anonymous.json"); + } + + constructor(page) { + super(page); + this.loginButton = page.getByRole("button", { name: "Login" }); + this.password = page.getByLabel("Password"); + this.userName = page.getByLabel("Email"); + this.message = page.getByText("Email or password is incorrect"); + this.badLoginMsg = page.getByText("Enter a valid email please"); + this.initialHeading = page.getByRole("heading", { name: "Log into my account" }); + } + + async fillEmailAndPasswordInputs(email, password) { + await this.userName.fill(email); + await this.password.fill(password); + } + + async clickLoginButton() { + await this.loginButton.click(); + } + + async setupAllowedUser() { + await this.mockRPC("get-profile", "logged-in-user/get-profile-logged-in.json"); + await this.mockRPC("get-teams", "logged-in-user/get-teams-default.json"); + await this.mockRPC("get-font-variants?team-id=*", "logged-in-user/get-font-variants-empty.json"); + await this.mockRPC("get-projects?team-id=*", "logged-in-user/get-projects-default.json"); + await this.mockRPC("get-team-members?team-id=*", "logged-in-user/get-team-members-your-penpot.json"); + await this.mockRPC("get-team-users?team-id=*", "logged-in-user/get-team-users-single-user.json"); + await this.mockRPC( + "get-unread-comment-threads?team-id=*", + "logged-in-user/get-team-users-single-user.json", + ); + await this.mockRPC("get-team-recent-files?team-id=*", "logged-in-user/get-team-recent-files-empty.json"); + await this.mockRPC( + "get-profiles-for-file-comments", + "logged-in-user/get-profiles-for-file-comments-empty.json", + ); + } + + async setupLoginSuccess() { + await this.mockRPC("login-with-password", "logged-in-user/login-with-password-success.json"); + } + + async setupLoginError() { + await this.mockRPC("login-with-password", "login-with-password-error.json", { status: 400 }); + } +} + +export default LoginPage; diff --git a/frontend/playwright/ui/pages/login-page.js b/frontend/playwright/ui/pages/login-page.js deleted file mode 100644 index 1358f4ab3..000000000 --- a/frontend/playwright/ui/pages/login-page.js +++ /dev/null @@ -1,76 +0,0 @@ -import { interceptRPC } from "../../helpers/index"; - -class LoginPage { - constructor(page) { - this.page = page; - this.loginButton = page.getByRole("button", { name: "Login" }); - this.password = page.getByLabel("Password"); - this.userName = page.getByLabel("Email"); - this.message = page.getByText("Email or password is incorrect"); - this.badLoginMsg = page.getByText("Enter a valid email please"); - this.initialHeading = page.getByRole("heading", { name: "Log into my account" }); - } - - url() { - return this.page.url(); - } - - context() { - return this.page.context(); - } - - async fillEmailAndPasswordInputs(email, password) { - await this.userName.fill(email); - await this.password.fill(password); - } - - async clickLoginButton() { - await this.loginButton.click(); - } - - async setupAllowedUser() { - await interceptRPC(this.page, "get-profile", "logged-in-user/get-profile-logged-in.json"); - await interceptRPC(this.page, "get-teams", "logged-in-user/get-teams-default.json"); - await interceptRPC( - this.page, - "get-font-variants?team-id=*", - "logged-in-user/get-font-variants-empty.json", - ); - await interceptRPC(this.page, "get-projects?team-id=*", "logged-in-user/get-projects-default.json"); - await interceptRPC( - this.page, - "get-team-members?team-id=*", - "logged-in-user/get-team-members-your-penpot.json", - ); - await interceptRPC( - this.page, - "get-team-users?team-id=*", - "logged-in-user/get-team-users-single-user.json", - ); - await interceptRPC( - this.page, - "get-unread-comment-threads?team-id=*", - "logged-in-user/get-team-users-single-user.json", - ); - await interceptRPC( - this.page, - "get-team-recent-files?team-id=*", - "logged-in-user/get-team-recent-files-empty.json", - ); - await interceptRPC( - this.page, - "get-profiles-for-file-comments", - "logged-in-user/get-profiles-for-file-comments-empty.json", - ); - } - - async setupLoginSuccess() { - await interceptRPC(this.page, "login-with-password", "logged-in-user/login-with-password-success.json"); - } - - async setupLoginError() { - await interceptRPC(this.page, "login-with-password", "login-with-password-error.json", { status: 400 }); - } -} - -export default LoginPage; diff --git a/frontend/playwright/ui/specs/login.spec.js b/frontend/playwright/ui/specs/login.spec.js index 08d3753c4..dab5a5ca6 100644 --- a/frontend/playwright/ui/specs/login.spec.js +++ b/frontend/playwright/ui/specs/login.spec.js @@ -1,10 +1,8 @@ import { test, expect } from "@playwright/test"; -import { setupNotLogedIn } from "../../helpers/intercepts"; - -import LoginPage from "../pages/login-page"; +import { LoginPage } from "../pages/LoginPage"; test.beforeEach(async ({ page }) => { - await setupNotLogedIn(page); + await LoginPage.setupLoggedOutUser(page); await page.goto("/#/auth/login"); }); @@ -13,7 +11,7 @@ test("Shows login page when going to index and user is logged out", async ({ pag await loginPage.setupAllowedUser(); - await expect(loginPage.url()).toMatch(/auth\/login$/); + await expect(loginPage.page).toHaveURL(/auth\/login$/); await expect(loginPage.initialHeading).toBeVisible(); }); @@ -37,8 +35,7 @@ test("User logs in by filling the login form", async ({ page }) => { await loginPage.clickLoginButton(); await page.waitForURL('**/dashboard/**'); - await expect(page).toHaveURL(/dashboard/); - // await expect(loginPage.url()).toMatch(/dashboard/); + await expect(loginPage.page).toHaveURL(/dashboard/); }); test("User submits wrong credentials", async ({ page }) => { @@ -50,5 +47,5 @@ test("User submits wrong credentials", async ({ page }) => { await loginPage.clickLoginButton(); await expect(loginPage.message).toBeVisible(); - await expect(loginPage.url()).toMatch(/auth\/login$/); + await expect(loginPage.page).toHaveURL(/auth\/login$/); }); diff --git a/frontend/playwright/ui/specs/workspace.spec.js b/frontend/playwright/ui/specs/workspace.spec.js new file mode 100644 index 000000000..3f24e2d28 --- /dev/null +++ b/frontend/playwright/ui/specs/workspace.spec.js @@ -0,0 +1,54 @@ +import { test, expect } from "@playwright/test"; +import { BasePage } from "../pages/BasePage"; +import { MockWebSocketHelper } from "../../helpers/MockWebSocketHelper"; +import { presenceFixture } from "../../data/workspace/ws-notifications"; + +const anyProjectId = "c7ce0794-0992-8105-8004-38e630f7920b"; +const anyFileId = "c7ce0794-0992-8105-8004-38f280443849"; +const anyPageId = "c7ce0794-0992-8105-8004-38f28044384a"; + +const setupWorkspaceUser = (page) => { + BasePage.mockRPC(page, "get-profile", "logged-in-user/get-profile-logged-in.json"); + BasePage.mockRPC(page, "get-team-users?file-id=*", "logged-in-user/get-team-users-single-user.json"); + BasePage.mockRPC(page, "get-comment-threads?file-id=*", "workspace/get-comment-threads-empty.json"); + BasePage.mockRPC(page, "get-project?id=*", "workspace/get-project-default.json"); + BasePage.mockRPC(page, "get-team?id=*", "workspace/get-team-default.json"); + BasePage.mockRPC(page, /get\-file\?/, "workspace/get-file-blank.json"); + BasePage.mockRPC( + page, + "get-file-object-thumbnails?file-id=*", + "workspace/get-file-object-thumbnails-blank.json", + ); + BasePage.mockRPC( + page, + "get-profiles-for-file-comments?file-id=*", + "workspace/get-profile-for-file-comments.json", + ); + BasePage.mockRPC(page, "get-font-variants?team-id=*", "workspace/get-font-variants-empty.json"); + BasePage.mockRPC(page, "get-file-fragment?file-id=*", "workspace/get-file-fragment-blank.json"); + BasePage.mockRPC(page, "get-file-libraries?file-id=*", "workspace/get-file-libraries-empty.json"); +}; + +test.beforeEach(async ({ page }) => { + await MockWebSocketHelper.init(page); +}); + +test("User loads worskpace with empty file", async ({ page }) => { + await setupWorkspaceUser(page); + + await page.goto(`/#/workspace/${anyProjectId}/${anyFileId}?page-id=${anyPageId}`); + + await expect(page.getByTestId("page-name")).toHaveText("Page 1"); +}); + +test("User receives notifications updates in the workspace", async ({ page }) => { + await setupWorkspaceUser(page); + await page.goto(`/#/workspace/${anyProjectId}/${anyFileId}?page-id=${anyPageId}`); + + const ws = await MockWebSocketHelper.waitForURL("ws://0.0.0.0:3500/ws/notifications") + await ws.mockOpen(); + await expect(page.getByTestId("page-name")).toHaveText("Page 1"); + await ws.mockMessage(JSON.stringify(presenceFixture)); + await expect(page.getByTestId("active-users-list").getByAltText("Princesa Leia")).toHaveCount(2); + await ws.mockClose(); +}); diff --git a/frontend/playwright/workspace.spec.js b/frontend/playwright/workspace.spec.js deleted file mode 100644 index 07e8762ca..000000000 --- a/frontend/playwright/workspace.spec.js +++ /dev/null @@ -1,76 +0,0 @@ -import { test, expect } from "@playwright/test"; -import { interceptRPC, interceptRPCByRegex } from "./helpers/MockAPI"; -import { MockWebSocket } from "./helpers/MockWebSocket"; -import { presenceFixture } from "./fixtures/workspace/ws-notifications"; - -const anyProjectId = "c7ce0794-0992-8105-8004-38e630f7920b"; -const anyFileId = "c7ce0794-0992-8105-8004-38f280443849"; -const anyPageId = "c7ce0794-0992-8105-8004-38f28044384a"; - -const setupWorkspaceUser = (page) => { - interceptRPC(page, "get-profile", "logged-in-user/get-profile-logged-in.json"); - interceptRPC(page, "get-team-users?file-id=*", "logged-in-user/get-team-users-single-user.json"); - interceptRPC(page, "get-comment-threads?file-id=*", "workspace/get-comment-threads-empty.json"); - interceptRPC(page, "get-project?id=*", "workspace/get-project-default.json"); - interceptRPC(page, "get-team?id=*", "workspace/get-team-default.json"); - interceptRPCByRegex(page, /get\-file\?/, "workspace/get-file-blank.json"); - interceptRPC( - page, - "get-file-object-thumbnails?file-id=*", - "workspace/get-file-object-thumbnails-blank.json", - ); - interceptRPC( - page, - "get-profiles-for-file-comments?file-id=*", - "workspace/get-profile-for-file-comments.json", - ); - interceptRPC(page, "get-font-variants?team-id=*", "workspace/get-font-variants-empty.json"); - interceptRPC(page, "get-file-fragment?file-id=*", "workspace/get-file-fragment-blank.json"); - interceptRPC(page, "get-file-libraries?file-id=*", "workspace/get-file-libraries-empty.json"); -}; - -test.beforeEach(async ({ page }) => { - await MockWebSocket.init(page); -}); - -test("User loads worskpace with empty file", async ({ page }) => { - await setupWorkspaceUser(page); - - await page.goto(`/#/workspace/${anyProjectId}/${anyFileId}?page-id=${anyPageId}`); - - await expect(page.getByTestId("page-name")).toHaveText("Page 1"); -}); - -test.only("User receives notifications updates in the workspace", async ({ page }) => { - await setupWorkspaceUser(page); - await page.goto(`/#/workspace/${anyProjectId}/${anyFileId}?page-id=${anyPageId}`); - - const ws = await MockWebSocket.waitForURL("ws://0.0.0.0:3500/ws/notifications") - await ws.mockOpen(); - console.log('JEEEEEE', ws) - - await expect(page.getByTestId("page-name")).toHaveText("Page 1"); - - await ws.mockMessage(JSON.stringify(presenceFixture)); - - /* - await page.evaluate( - async ({ presenceFixture }) => { - const ws = await WebSocket.waitForURL("ws://0.0.0.0:3500/ws/notifications"); - ws.mockMessage(JSON.stringify(presenceFixture)); - }, - { presenceFixture }, - ); - */ - - await expect(page.getByTestId("active-users-list").getByAltText("Princesa Leia")).toHaveCount(2); - - await ws.mockClose(); - - /* - await page.evaluate(async () => { - const ws = await WebSocket.waitForURL("ws://0.0.0.0:3500/ws/notifications"); - ws.mockClose(); - }); - */ -}); diff --git a/frontend/src/app/main/data/workspace/notifications.cljs b/frontend/src/app/main/data/workspace/notifications.cljs index b721c2485..4bb3a9772 100644 --- a/frontend/src/app/main/data/workspace/notifications.cljs +++ b/frontend/src/app/main/data/workspace/notifications.cljs @@ -162,7 +162,6 @@ (assoc :text-color "#000000"))) (update-presence [presence] - (js/console.log "🥰 WIIIIII" (clj->js presence)) (-> presence (update session-id update-session presence) (d/without-nils)))]