From e28d56e670910de5a81cc9ff269758279f59a9eb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bel=C3=A9n=20Albeza?= Date: Wed, 8 May 2024 14:22:18 +0200 Subject: [PATCH] :sparkles: Add WorkspacePage POM for playwright testing --- .../playwright/ui/pages/BaseWebSocketPage.js | 2 +- frontend/playwright/ui/pages/WorkspacePage.js | 89 +++++++++++++++++++ .../playwright/ui/specs/workspace.spec.js | 46 +++------- 3 files changed, 103 insertions(+), 34 deletions(-) create mode 100644 frontend/playwright/ui/pages/WorkspacePage.js diff --git a/frontend/playwright/ui/pages/BaseWebSocketPage.js b/frontend/playwright/ui/pages/BaseWebSocketPage.js index f76a7f5c4..85700e048 100644 --- a/frontend/playwright/ui/pages/BaseWebSocketPage.js +++ b/frontend/playwright/ui/pages/BaseWebSocketPage.js @@ -8,7 +8,7 @@ export class BaseWebSocketPage extends BasePage { * @param {Page} page * @returns */ - static setupWebSockets(page) { + static initWebSockets(page) { return MockWebSocketHelper.init(page); } diff --git a/frontend/playwright/ui/pages/WorkspacePage.js b/frontend/playwright/ui/pages/WorkspacePage.js new file mode 100644 index 000000000..f89c57a7a --- /dev/null +++ b/frontend/playwright/ui/pages/WorkspacePage.js @@ -0,0 +1,89 @@ +import { expect } from "@playwright/test"; +import { BaseWebSocketPage } from "./BaseWebSocketPage"; + +export class WorkspacePage extends BaseWebSocketPage { + /** + * This should be called on `test.beforeEach`. + * + * @param {Page} page + * @returns + */ + static async init(page) { + await BaseWebSocketPage.initWebSockets(page); + + await BaseWebSocketPage.mockRPC(page, "get-profile", "logged-in-user/get-profile-logged-in.json"); + await BaseWebSocketPage.mockRPC( + page, + "get-team-users?file-id=*", + "logged-in-user/get-team-users-single-user.json", + ); + await BaseWebSocketPage.mockRPC( + page, + "get-comment-threads?file-id=*", + "workspace/get-comment-threads-empty.json", + ); + await BaseWebSocketPage.mockRPC(page, "get-project?id=*", "workspace/get-project-default.json"); + await BaseWebSocketPage.mockRPC(page, "get-team?id=*", "workspace/get-team-default.json"); + await BaseWebSocketPage.mockRPC( + page, + "get-profiles-for-file-comments?file-id=*", + "workspace/get-profile-for-file-comments.json", + ); + } + + static anyProjectId = "c7ce0794-0992-8105-8004-38e630f7920b"; + static anyFileId = "c7ce0794-0992-8105-8004-38f280443849"; + static anyPageId = "c7ce0794-0992-8105-8004-38f28044384a"; + + #ws = null; + + constructor(page) { + super(page); + // TODO: add locators + this.pageName = page.getByTestId("page-name"); + this.presentUserListItems = page.getByTestId("active-users-list").getByAltText("Princesa Leia"); + } + + async goToWorkspace() { + await this.page.goto( + `/#/workspace/${WorkspacePage.anyProjectId}/${WorkspacePage.anyFileId}?page-id=${WorkspacePage.anyPageId}`, + ); + + this.#ws = await this.waitForNotificationsWebSocket(); + await this.#ws.mockOpen(); + await this.#waitForWebSocketReadiness(); + } + + async #waitForWebSocketReadiness() { + // TODO: find a better event to settle whether the app is ready to receive notifications via ws + await expect(this.pageName).toHaveText("Page 1"); + } + + async sendPresenceMessage(fixture) { + await this.#ws.mockMessage(JSON.stringify(fixture)); + } + + async cleanUp() { + await this.#ws.mockClose(); + } + + async setupEmptyFile() { + await this.mockRPC("get-profile", "logged-in-user/get-profile-logged-in.json"); + await this.mockRPC("get-team-users?file-id=*", "logged-in-user/get-team-users-single-user.json"); + await this.mockRPC("get-comment-threads?file-id=*", "workspace/get-comment-threads-empty.json"); + await this.mockRPC("get-project?id=*", "workspace/get-project-default.json"); + await this.mockRPC("get-team?id=*", "workspace/get-team-default.json"); + await this.mockRPC( + "get-profiles-for-file-comments?file-id=*", + "workspace/get-profile-for-file-comments.json", + ); + await this.mockRPC(/get\-file\?/, "workspace/get-file-blank.json"); + await this.mockRPC( + "get-file-object-thumbnails?file-id=*", + "workspace/get-file-object-thumbnails-blank.json", + ); + await this.mockRPC("get-font-variants?team-id=*", "workspace/get-font-variants-empty.json"); + await this.mockRPC("get-file-fragment?file-id=*", "workspace/get-file-fragment-blank.json"); + await this.mockRPC("get-file-libraries?file-id=*", "workspace/get-file-libraries-empty.json"); + } +} diff --git a/frontend/playwright/ui/specs/workspace.spec.js b/frontend/playwright/ui/specs/workspace.spec.js index 57a60e979..663e76b02 100644 --- a/frontend/playwright/ui/specs/workspace.spec.js +++ b/frontend/playwright/ui/specs/workspace.spec.js @@ -1,46 +1,26 @@ import { test, expect } from "@playwright/test"; -import { BaseWebSocketPage } from "../pages/BaseWebSocketPage"; -import { MockWebSocketHelper } from "../../helpers/MockWebSocketHelper"; +import { WorkspacePage } from "../pages/WorkspacePage"; 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) => { - page.mockRPC("get-profile", "logged-in-user/get-profile-logged-in.json"); - page.mockRPC("get-team-users?file-id=*", "logged-in-user/get-team-users-single-user.json"); - page.mockRPC("get-comment-threads?file-id=*", "workspace/get-comment-threads-empty.json"); - page.mockRPC("get-project?id=*", "workspace/get-project-default.json"); - page.mockRPC("get-team?id=*", "workspace/get-team-default.json"); - page.mockRPC(/get\-file\?/, "workspace/get-file-blank.json"); - page.mockRPC("get-file-object-thumbnails?file-id=*", "workspace/get-file-object-thumbnails-blank.json"); - page.mockRPC("get-profiles-for-file-comments?file-id=*", "workspace/get-profile-for-file-comments.json"); - page.mockRPC("get-font-variants?team-id=*", "workspace/get-font-variants-empty.json"); - page.mockRPC("get-file-fragment?file-id=*", "workspace/get-file-fragment-blank.json"); - page.mockRPC("get-file-libraries?file-id=*", "workspace/get-file-libraries-empty.json"); -}; - test.beforeEach(async ({ page }) => { - await MockWebSocketHelper.init(page); + await WorkspacePage.init(page); }); -test.skip("User loads worskpace with empty file", async ({ page }) => { - await setupWorkspaceUser(page); +test("User loads worskpace with empty file", async ({ page }) => { + const workspacePage = new WorkspacePage(page); + await workspacePage.setupEmptyFile(page); - await page.goto(`/#/workspace/${anyProjectId}/${anyFileId}?page-id=${anyPageId}`); + await workspacePage.goToWorkspace(); - await expect(page.getByTestId("page-name")).toHaveText("Page 1"); + await expect(workspacePage.pageName).toHaveText("Page 1"); }); -test.skip("User receives notifications updates in the workspace", async ({ page }) => { - await setupWorkspaceUser(page); - await page.goto(`/#/workspace/${anyProjectId}/${anyFileId}?page-id=${anyPageId}`); +test("User receives presence notifications updates in the workspace", async ({ page }) => { + const workspacePage = new WorkspacePage(page); + await workspacePage.setupEmptyFile(); + + await workspacePage.goToWorkspace(); + await workspacePage.sendPresenceMessage(presenceFixture); - 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(); });