diff --git a/frontend/src/app/main/ui/workspace/tokens/CHANGELOG.md b/frontend/src/app/main/ui/workspace/tokens/CHANGELOG.md index 3b58325f3..a55d4e1d1 100644 --- a/frontend/src/app/main/ui/workspace/tokens/CHANGELOG.md +++ b/frontend/src/app/main/ui/workspace/tokens/CHANGELOG.md @@ -24,6 +24,12 @@ If possible add video here from PR as well Fixes opacity not being applied correctly to shapes. +### 2024-08-05 - Fix stroke witdth applying breaking app + +[Link to PR](https://github.com/orgs/tokens-studio/projects/69/views/11?pane=issue&itemId=73072870) + +`:stroke-width` token applying wont update for shapes without a stroke. + ### 2024-07-25 - UX Improvements for the context menu [Link to PR](https://github.com/tokens-studio/tokens-studio-for-penpot/pull/224) diff --git a/frontend/src/app/main/ui/workspace/tokens/changes.cljs b/frontend/src/app/main/ui/workspace/tokens/changes.cljs index b146b5c2a..cbd1b0509 100644 --- a/frontend/src/app/main/ui/workspace/tokens/changes.cljs +++ b/frontend/src/app/main/ui/workspace/tokens/changes.cljs @@ -117,9 +117,12 @@ (defn update-stroke-width [value shape-ids] - (dch/update-shapes shape-ids (fn [shape] - (when (seq (:strokes shape)) - (assoc-in shape [:strokes 0 :stroke-width] value))))) + (dch/update-shapes shape-ids + (fn [shape] + (when (seq (:strokes shape)) + (assoc-in shape [:strokes 0 :stroke-width] value))) + {:reg-objects? true + :attrs [:strokes]})) (defn update-shape-dimensions [value shape-ids attributes] (ptk/reify ::update-shape-dimensions diff --git a/frontend/test/token_tests/logic/token_actions_test.cljs b/frontend/test/token_tests/logic/token_actions_test.cljs index f58228f77..3b04ef9ab 100644 --- a/frontend/test/token_tests/logic/token_actions_test.cljs +++ b/frontend/test/token_tests/logic/token_actions_test.cljs @@ -13,12 +13,12 @@ (t/use-fixtures :each {:before thp/reset-idmap!}) -(defn- setup-file - [] +(defn setup-file + [& {:keys [rect-1 rect-2 rect-3]}] (-> (cthf/sample-file :file-1 :page-label :page-1) - (ctho/add-rect :rect-1 {}) - (ctho/add-rect :rect-2 {}) - (ctho/add-rect :rect-3 {}) + (ctho/add-rect :rect-1 rect-1) + (ctho/add-rect :rect-2 rect-2) + (ctho/add-rect :rect-3 rect-3) (toht/add-token :token-1 {:value "12" :name "borderRadius.sm" :type :border-radius}) @@ -236,6 +236,39 @@ (t/is (= (:rotation (:applied-tokens rect-1')) (:id token-target'))) (t/is (= (:rotation rect-1') 120))))))))) +(t/deftest test-apply-stroke-width + (t/testing "applies stroke-width token and updates the shapes with stroke" + (t/async + done + (let [file (-> (setup-file {:rect-1 {:strokes [{:stroke-alignment :inner, + :stroke-style :solid, + :stroke-color "#000000", + :stroke-opacity 1, + :stroke-width 5}]}}) + (toht/add-token :token-target {:value "10" + :name "stroke-width.sm" + :type :stroke-width})) + store (ths/setup-store file) + rect-with-stroke (cths/get-shape file :rect-1) + rect-without-stroke (cths/get-shape file :rect-2) + events [(wtch/apply-token {:shape-ids [(:id rect-with-stroke) (:id rect-without-stroke)] + :attributes #{:stroke-width} + :token (toht/get-token file :token-target) + :on-update-shape wtch/update-stroke-width})]] + (tohs/run-store-async + store done events + (fn [new-state] + (let [file' (ths/get-file-from-store new-state) + token-target' (toht/get-token file' :token-target) + rect-with-stroke' (cths/get-shape file' :rect-1) + rect-without-stroke' (cths/get-shape file' :rect-2)] + (t/testing "token got applied to rect with stroke and shape stroke got updated" + (t/is (= (:stroke-width (:applied-tokens rect-with-stroke')) (:id token-target'))) + (t/is (= (get-in rect-with-stroke' [:strokes 0 :stroke-width]) 10))) + (t/testing "token got applied to rect without stroke but shape didnt get updated" + (t/is (= (:stroke-width (:applied-tokens rect-without-stroke')) (:id token-target'))) + (t/is (empty? (:strokes rect-without-stroke'))))))))))) + (t/deftest test-toggle-token-none (t/testing "should apply token to all selected items, where no item has the token applied" (t/async