From 2cbc09a0e2003cf205dbde7146e69ed2b1ad13f6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bel=C3=A9n=20Albeza?= Date: Thu, 6 Feb 2025 09:28:51 +0100 Subject: [PATCH] :bug: Fix local library being collapsed by default (#5775) * :bug: Fix local library being collapsed by default * :recycle: Move layers tab spec code to its own file --- .../playwright/ui/specs/assets-tab.spec.js | 67 +++++++++++++++++ .../playwright/ui/specs/layers-tab.spec.js | 21 ++++++ frontend/playwright/ui/specs/sidebar.spec.js | 73 ------------------- .../sidebar/assets/file_library.cljs | 4 +- 4 files changed, 90 insertions(+), 75 deletions(-) create mode 100644 frontend/playwright/ui/specs/assets-tab.spec.js create mode 100644 frontend/playwright/ui/specs/layers-tab.spec.js delete mode 100644 frontend/playwright/ui/specs/sidebar.spec.js diff --git a/frontend/playwright/ui/specs/assets-tab.spec.js b/frontend/playwright/ui/specs/assets-tab.spec.js new file mode 100644 index 000000000..bc5d7b5a2 --- /dev/null +++ b/frontend/playwright/ui/specs/assets-tab.spec.js @@ -0,0 +1,67 @@ +import { test, expect } from "@playwright/test"; +import { WorkspacePage } from "../pages/WorkspacePage"; + +test.beforeEach(async ({ page }) => { + await WorkspacePage.init(page); +}); + +test("User adds a library and its automatically selected in the color palette", async ({ + page, +}) => { + const workspacePage = new WorkspacePage(page); + await workspacePage.setupEmptyFile(); + await workspacePage.mockRPC( + "link-file-to-library", + "workspace/link-file-to-library.json", + ); + await workspacePage.mockRPC( + "unlink-file-from-library", + "workspace/unlink-file-from-library.json", + ); + await workspacePage.mockRPC( + "get-team-shared-files?team-id=*", + "workspace/get-team-shared-libraries-non-empty.json", + ); + + await workspacePage.goToWorkspace(); + + // Add Testing library 1 + await workspacePage.clickColorPalette(); + await workspacePage.clickAssets(); + // Now the get-file call should return a library + await workspacePage.mockRPC(/get\-file\?/, "workspace/get-file-library.json"); + await workspacePage.openLibrariesModal(); + await workspacePage.clickLibrary("Testing library 1"); + await workspacePage.closeLibrariesModal(); + + await expect( + workspacePage.palette.getByRole("button", { name: "test-color-187cd5" }), + ).toBeVisible(); + + // Remove Testing library 1 + await workspacePage.openLibrariesModal(); + await workspacePage.clickLibrary("Testing library 1"); + await workspacePage.closeLibrariesModal(); + + await expect( + workspacePage.palette.getByText( + "There are no color styles in your library yet", + ), + ).toBeVisible(); +}); + +test("BUG 10090 - Local library should be expanded by default", async ({ + page, +}) => { + const workspacePage = new WorkspacePage(page); + await workspacePage.setupEmptyFile(page); + + await workspacePage.goToWorkspace(); + + await workspacePage.clickAssets(); + + expect(workspacePage.sidebar.getByText("Local library")).toBeVisible(); + expect(workspacePage.sidebar.getByText("Components")).toBeVisible(); + expect(workspacePage.sidebar.getByText("Colors")).toBeVisible(); + expect(workspacePage.sidebar.getByText("Typographies")).toBeVisible(); +}); diff --git a/frontend/playwright/ui/specs/layers-tab.spec.js b/frontend/playwright/ui/specs/layers-tab.spec.js new file mode 100644 index 000000000..fd86e88a1 --- /dev/null +++ b/frontend/playwright/ui/specs/layers-tab.spec.js @@ -0,0 +1,21 @@ +import { test, expect } from "@playwright/test"; +import { WorkspacePage } from "../pages/WorkspacePage"; + +test.beforeEach(async ({ page }) => { + await WorkspacePage.init(page); +}); + +test("BUG 7466 - Layers tab height extends to the bottom when 'Pages' is collapsed", async ({ + page, +}) => { + const workspace = new WorkspacePage(page); + await workspace.setupEmptyFile(); + + await workspace.goToWorkspace(); + + const { height: heightExpanded } = await workspace.layers.boundingBox(); + await workspace.togglePages(); + const { height: heightCollapsed } = await workspace.layers.boundingBox(); + + expect(heightExpanded > heightCollapsed); +}); diff --git a/frontend/playwright/ui/specs/sidebar.spec.js b/frontend/playwright/ui/specs/sidebar.spec.js deleted file mode 100644 index b97301889..000000000 --- a/frontend/playwright/ui/specs/sidebar.spec.js +++ /dev/null @@ -1,73 +0,0 @@ -import { test, expect } from "@playwright/test"; -import { WorkspacePage } from "../pages/WorkspacePage"; - -test.beforeEach(async ({ page }) => { - await WorkspacePage.init(page); -}); - -test.describe("Layers tab", () => { - test("BUG 7466 - Layers tab height extends to the bottom when 'Pages' is collapsed", async ({ - page, - }) => { - const workspace = new WorkspacePage(page); - await workspace.setupEmptyFile(); - - await workspace.goToWorkspace(); - - const { height: heightExpanded } = await workspace.layers.boundingBox(); - await workspace.togglePages(); - const { height: heightCollapsed } = await workspace.layers.boundingBox(); - - expect(heightExpanded > heightCollapsed); - }); -}); - -test.describe("Assets tab", () => { - test("User adds a library and its automatically selected in the color palette", async ({ - page, - }) => { - const workspacePage = new WorkspacePage(page); - await workspacePage.setupEmptyFile(); - await workspacePage.mockRPC( - "link-file-to-library", - "workspace/link-file-to-library.json", - ); - await workspacePage.mockRPC( - "unlink-file-from-library", - "workspace/unlink-file-from-library.json", - ); - await workspacePage.mockRPC( - "get-team-shared-files?team-id=*", - "workspace/get-team-shared-libraries-non-empty.json", - ); - - await workspacePage.goToWorkspace(); - - // Add Testing library 1 - await workspacePage.clickColorPalette(); - await workspacePage.clickAssets(); - // Now the get-file call should return a library - await workspacePage.mockRPC( - /get\-file\?/, - "workspace/get-file-library.json", - ); - await workspacePage.openLibrariesModal(); - await workspacePage.clickLibrary("Testing library 1"); - await workspacePage.closeLibrariesModal(); - - await expect( - workspacePage.palette.getByRole("button", { name: "test-color-187cd5" }), - ).toBeVisible(); - - // Remove Testing library 1 - await workspacePage.openLibrariesModal(); - await workspacePage.clickLibrary("Testing library 1"); - await workspacePage.closeLibrariesModal(); - - await expect( - workspacePage.palette.getByText( - "There are no color styles in your library yet", - ), - ).toBeVisible(); - }); -}); diff --git a/frontend/src/app/main/ui/workspace/sidebar/assets/file_library.cljs b/frontend/src/app/main/ui/workspace/sidebar/assets/file_library.cljs index 296836b85..c66c9cd9f 100644 --- a/frontend/src/app/main/ui/workspace/sidebar/assets/file_library.cljs +++ b/frontend/src/app/main/ui/workspace/sidebar/assets/file_library.cljs @@ -320,7 +320,7 @@ (tr "workspace.assets.not-found")]])])) (mf/defc file-library* - [{:keys [file is-local is-default-open? filters]}] + [{:keys [file is-local is-default-open filters]}] (let [file-id (:id file) file-name (:name file) page-id (dm/get-in file [:data :pages 0]) @@ -376,7 +376,7 @@ ;; if the user has closed it specifically, respect that false (or force-lib-open? - (d/nilv (:library open-status) is-default-open?))) + (d/nilv (:library open-status) is-default-open))) unselect-all (mf/use-fn