github/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2026-06-15 20:02:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

🐛 Fix issue with padding and margin tokens in plugins

Browse Source
This commit is contained in:
alonso.torres 2026-06-09 17:53:59 +02:00
parent 4b03cfd20c
commit cd52287349
2 changed files with 79 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/app/plugins/tokens.cljs
View File

@ -43,7 +43,16 @@
:m4 :margin-bottom-left})
(def ^:private map:token-attr-plugin->token-attr
(map-invert map:token-attr->token-attr-plugin))
(merge
(map-invert map:token-attr->token-attr-plugin)
{:padding-top :p1
:padding-right :p2
:padding-bottom :p3
:padding-left :p4
:margin-top :m1
:margin-right :m2
:margin-bottom :m3
:margin-left :m4}))
(defn token-attr->token-attr-plugin
[k]
@ -544,4 +553,3 @@
(let [set (u/locate-token-set file-id set-id)]
(when (some? set)
(token-set-proxy plugin-id file-id set-id))))}))

70
frontend/test/frontend_tests/plugins/tokens_test.cljs
View File

@ -6,8 +6,19 @@
(ns frontend-tests.plugins.tokens-test
(:require
[app.common.test-helpers.compositions :as ctho]
[app.common.test-helpers.files :as cthf]
[app.common.test-helpers.ids-map :as cthi]
[app.common.test-helpers.tokens :as ctht]
[app.common.types.tokens-lib :as ctob]
[app.main.store :as st]
[app.plugins.api :as api]
[app.plugins.tokens :as ptok]
[cljs.test :as t :include-macros true]))
[cljs.test :as t :include-macros true]
[frontend-tests.helpers.state :as ths]
[potok.v2.core :as ptk]))
(t/use-fixtures :each {:before cthi/reset-idmap!})
;; Regression coverage for issue #9162.
;;
@ -54,6 +65,16 @@
(t/is (= :p1 (ptok/token-attr-plugin->token-attr :padding-top-left)))
(t/is (= :m3 (ptok/token-attr-plugin->token-attr :margin-bottom-right))))
(t/deftest token-attr-plugin->token-attr-resolves-padding-margin-side-aliases
(t/is (= :p1 (ptok/token-attr-plugin->token-attr :padding-top)))
(t/is (= :p2 (ptok/token-attr-plugin->token-attr :padding-right)))
(t/is (= :p3 (ptok/token-attr-plugin->token-attr :padding-bottom)))
(t/is (= :p4 (ptok/token-attr-plugin->token-attr :padding-left)))
(t/is (= :m1 (ptok/token-attr-plugin->token-attr :margin-top)))
(t/is (= :m2 (ptok/token-attr-plugin->token-attr :margin-right)))
(t/is (= :m3 (ptok/token-attr-plugin->token-attr :margin-bottom)))
(t/is (= :m4 (ptok/token-attr-plugin->token-attr :margin-left))))
(t/deftest token-attr-plugin->token-attr-coerces-string-input
;; This is the actual regression — JS plugin calls supply strings.
(t/is (= :fill (ptok/token-attr-plugin->token-attr "fill")))
@ -76,6 +97,53 @@
(t/is (true? (boolean (ptok/token-attr? "r1"))))
(t/is (true? (boolean (ptok/token-attr? "m3")))))
(t/deftest shape-apply-token-accepts-padding-top
(t/async
done
(let [set-id (cthi/new-id! :token-set)
token-id (cthi/new-id! :spacing-token)
file (-> (cthf/sample-file :file1 :page-label :page1)
(ctho/add-frame :frame1 {:layout :flex})
(ctht/add-tokens-lib)
(ctht/update-tokens-lib
#(-> %
(ctob/add-set
(ctob/make-token-set :id set-id
:name "spacing"))
(ctob/add-theme
(ctob/make-token-theme :name "theme"
:sets #{"spacing"}))
(ctob/set-active-themes #{"/theme"})
(ctob/add-token
set-id
(ctob/make-token :id token-id
:name "spacing.medium"
:type :spacing
:value 16)))))
store (ths/setup-store file)
_ (set! st/state store)
_ (set! st/stream (ptk/input-stream store))
^js context (api/create-context "00000000-0000-0000-0000-000000000000")
^js page (.-currentPage context)
^js shape (.getShapeById page (str (cthi/id :frame1)))
^js library (.-library context)
^js local (.-local library)
^js catalog (.-tokens local)
^js token-set (.getSetById catalog (str set-id))
^js token (.getTokenById token-set (str token-id))]
(.applyToken shape token #js ["paddingTop"])
(js/setTimeout
(fn []
(let [shape-id (cthi/id :frame1)
page-id (cthf/current-page-id file)]
(t/is (= "spacing.medium" (.. shape -tokens -paddingTopLeft)))
(t/is (= "spacing.medium"
(get-in @store
[:files (:id file) :data :pages-index page-id
:objects shape-id :applied-tokens :p1])))
(done)))
0))))
(t/deftest token-attr?-rejects-unknown-input
(t/is (false? (boolean (ptok/token-attr? :not-a-real-attr))))
(t/is (false? (boolean (ptok/token-attr? "not-a-real-attr"))))