From 53530e958a912f037a05e11331fcc343dc3bbb06 Mon Sep 17 00:00:00 2001 From: Eva Marco Date: Mon, 18 May 2026 16:26:28 +0200 Subject: [PATCH] :bug: Fix incorrect warning when token applied (#9708) Signed-off-by: Andrey Antukh Co-authored-by: Andrey Antukh --- .../playwright/ui/specs/tokens/apply.spec.js | 73 +++++++++++++++++-- .../data/workspace/tokens/application.cljs | 9 ++- .../ui/workspace/tokens/management/group.cljs | 2 +- 3 files changed, 74 insertions(+), 10 deletions(-) diff --git a/frontend/playwright/ui/specs/tokens/apply.spec.js b/frontend/playwright/ui/specs/tokens/apply.spec.js index df4fcfb247..4a49cbc1aa 100644 --- a/frontend/playwright/ui/specs/tokens/apply.spec.js +++ b/frontend/playwright/ui/specs/tokens/apply.spec.js @@ -1080,6 +1080,59 @@ test("BUG: 14136 Apply grid layout padding token to a shape from the sidebar doe ).toBe("16"); }); +test("BUG: 14191, Apply tokens from different set", async ({ page }) => { + const { + workspacePage, + tokensSidebar, + tokenContextMenuForToken, + tokenThemesSetsSidebar, + tokenSetGroupItems, + } = await setupTokensFileRender(page); + + await page.getByRole("tab", { name: "Layers" }).click(); + + await workspacePage.layers + .getByTestId("layer-row") + .filter({ hasText: "Rectangle" }) + .first() + .click(); + + await page.getByRole("tab", { name: "Tokens" }).click(); + + await unfoldTokenType(tokensSidebar, "Border radius"); + // Apply border radius token from core set + await tokensSidebar.getByRole("button", { name: "borderRadius.xl" }).click(); + + const borderRadiusSection = page.getByRole("region", { + name: "Border radius section", + }); + await expect(borderRadiusSection).toBeVisible(); + + // Check if token pill is visible on design tab on right sidebar + const brTokenPillxl = borderRadiusSection.getByRole("button", { + name: "borderRadius.xl", + }); + await expect(brTokenPillxl).toBeVisible(); + + // Change active token set + await expect( + tokenThemesSetsSidebar.getByRole("button", { name: "theme" }), + ).toBeVisible(); + + await tokenThemesSetsSidebar.getByRole("button", { name: "theme" }).click(); + // Apply border radius token from theme set + await unfoldTokenType(tokensSidebar, "Border radius"); + + await tokensSidebar + .getByRole("button", { name: "card.borderRadius" }) + .click(); + + const brTokenPillCard = borderRadiusSection.getByRole("button", { + name: "card.borderRadius", + }); + await expect(brTokenPillCard).toBeVisible(); +}); + test.describe("Numeric Input and Token Integration Tests", () => { test("Token pill persists after blur in gap inputs", async ({ page }) => { // Setup the workspace with token features enabled @@ -1436,8 +1489,13 @@ test.describe("Numeric Input and Token Integration Tests", () => { flags: ["enable-token-combobox", "enable-feature-token-input"], }); // Create a token with a reference value in other set. - await createToken(page, "Dimensions", "reference-token", "Value", "{card.padding}"); - + await createToken( + page, + "Dimensions", + "reference-token", + "Value", + "{card.padding}", + ); // Apply this token to a shape await page.getByRole("tab", { name: "Layers" }).click(); @@ -1460,11 +1518,16 @@ test.describe("Numeric Input and Token Integration Tests", () => { }); await expect(measuresSection).toBeVisible(); - await expect(measuresSection.getByRole('button', { name: 'reference-token' })).toBeVisible(); + await expect( + measuresSection.getByRole("button", { name: "reference-token" }), + ).toBeVisible(); // Deactivate token set where reference token exist to make token broken - await tokenThemesSetsSidebar.getByRole('button', { name: 'theme' }).getByRole('checkbox').click(); - + await tokenThemesSetsSidebar + .getByRole("button", { name: "theme" }) + .getByRole("checkbox") + .click(); + // Check if token pill show broken reference state const brokenPill = measuresSection.getByRole("button", { name: "is not in any active set", diff --git a/frontend/src/app/main/data/workspace/tokens/application.cljs b/frontend/src/app/main/data/workspace/tokens/application.cljs index 3ecb67da69..9c998c1c80 100644 --- a/frontend/src/app/main/data/workspace/tokens/application.cljs +++ b/frontend/src/app/main/data/workspace/tokens/application.cljs @@ -726,10 +726,11 @@ (rx/of res)))) (rx/of (dwu/commit-undo-transaction undo-id))))))))) - (rx/of (ntf/show {:content (tr "workspace.tokens.error-text-edition") - :type :toast - :level :warning - :timeout 3000}))))))) + (when text-editing? + (rx/of (ntf/show {:content (tr "workspace.tokens.error-text-edition") + :type :toast + :level :warning + :timeout 3000})))))))) (defn apply-spacing-token-separated "Handles edge-case for spacing token when applying token via toggle button. diff --git a/frontend/src/app/main/ui/workspace/tokens/management/group.cljs b/frontend/src/app/main/ui/workspace/tokens/management/group.cljs index a9b6914b9f..bd36c11a9c 100644 --- a/frontend/src/app/main/ui/workspace/tokens/management/group.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/management/group.cljs @@ -147,7 +147,7 @@ on-token-pill-click (mf/use-fn - (mf/deps not-editing? selected-ids tokens-lib) + (mf/deps not-editing? selected-ids tokens-lib selected-token-set-id) (fn [event token] (let [token (ctob/get-token tokens-lib selected-token-set-id (:id token))] (dom/stop-propagation event)