mirror of
https://github.com/penpot/penpot.git
synced 2026-11-08 11:04:44 +00:00
* 🐛 Normalize stored SVG attribute keys to kebab-case The v3 reader already emits kebab-case keys, but birth stored the camelCase React prop names, so import and export never converged: fill rules painted wrongly and filter defs lost their blur. Birth now normalizes every stored attribute key to kebab-case through the `svg-props` whitelist (`attrs->kebab-props`), applied on all element paths of the svg importer, on the file builder and on defs. svg-raw `:content` is kebab-ized in spelling only and keeps unknown keys, because the sidebar reads them. Non-spec attrs Penpot must keep live in `penpot-extra-attrs`, seeded with `:stroke-style`. Render boundaries translate back to camelCase for React and for the wasm props, and the shape schema declares the closed kebab contract derived from that same whitelist, so birth and validation cannot drift. Migration `0035-fix-shape-svg-attrs-and-defs` converts old files once with the birth transforms, and carries back the svg-viewbox rect normalization the withdrawn `0021` had. That old id leaves `available-migrations`, so files recording it migrate again through this one, and the binfile cleaner drops its own svg repair. Review fixes included here: `setup-opacity` and the blend mode read the stored keys, gradient stops accept `:style` as a CSS string or a map, `inherit-attributes` reads `:style` so a child's inline style beats the inherited group attr per CSS, and the svg-attrs menu shows spec spelling (`viewBox`, `class`) through `stored-attr-display-name`. Tests cover the migration, the closed svg-attr schemas and the import/export round trip; the svg-content schema test pins its sample seed, which dealt no svg-raw shape on unlucky runs. Closes #11947 AI-assisted-by: muse-spark-1.3-contributor * 🐛 Keep legacy svg node tags and transforms valid in migration 0035 The closed svg node schemas require keyword tags and map attrs, but stored files hold def and svg-raw content tags as strings, and some node `:attrs` as nil. Migration 0035 left them as they were, so the file data check that runs after migrating rejected those files and they could not be opened. `normalize-node-tree` now turns string tags into keywords and nil attrs into an empty map, at birth and in 0035. With keyword tags, the svg defs renderer applies the shape transform to user-space defs. Legacy `:svg-transform` values are plain maps, which multiply into NaN matrices. `gmt/coerce` turns them into matrices, in 0035 and in the binfile cleaner, because every v3 import decodes the transform as a plain map again. Legacy masks and gradients now render as designed in the svg renderer. The binfile test helper calls `export-files!` with the current config keys. AI-assisted-by: claude-opus-5-5 ---------
123 lines
5.4 KiB
Clojure
123 lines
5.4 KiB
Clojure
;; This Source Code Form is subject to the terms of the Mozilla Public
|
|
;; License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
|
;;
|
|
;; Copyright (c) KALEIDOS SUBSIDIARY SL
|
|
|
|
(ns common-tests.files-builder-test
|
|
(:require
|
|
[app.common.files.builder :as fb]
|
|
[app.common.uuid :as uuid]
|
|
[clojure.test :as t]))
|
|
|
|
(defn- stroke
|
|
[color]
|
|
[{:stroke-style :solid
|
|
:stroke-alignment :inner
|
|
:stroke-width 1
|
|
:stroke-color color
|
|
:stroke-opacity 1}])
|
|
|
|
(t/deftest add-shape-normalizes-svg-defs-and-content-to-kebab
|
|
;; Defense in depth: generic producers that bypass `shapes-builder`
|
|
;; still land on the stored kebab convention for defs and content.
|
|
(let [file-id (uuid/next)
|
|
page-id (uuid/next)
|
|
shape-id (uuid/next)
|
|
state (-> (fb/create-state)
|
|
(fb/add-file {:id file-id :name "Test file"})
|
|
(fb/add-page {:id page-id :name "Page 1"})
|
|
(fb/add-shape {:id shape-id
|
|
:type :svg-raw
|
|
:name "raw"
|
|
:x 0
|
|
:y 0
|
|
:width 10
|
|
:height 10
|
|
:content {:tag :g
|
|
:attrs {:strokeWidth "2"
|
|
:data-foo "keep-me"}
|
|
:content []}
|
|
:svg-attrs {:fillRule "evenodd"}
|
|
:svg-defs {"g1" {:tag :linearGradient
|
|
:attrs {:id "g1"
|
|
:gradientUnits "userSpaceOnUse"}
|
|
:content []}}}))
|
|
shape (fb/get-shape state shape-id)
|
|
node (get (:svg-defs shape) "g1")]
|
|
(t/is (= "evenodd" (get-in shape [:svg-attrs :fill-rule])))
|
|
(t/is (= "userSpaceOnUse" (get-in node [:attrs :gradient-units])))
|
|
(t/is (= "2" (get-in shape [:content :attrs :stroke-width])))
|
|
(t/is (= "keep-me" (get-in shape [:content :attrs :data-foo]))
|
|
"unknown content keys survive")))
|
|
|
|
(t/deftest add-bool-uses-difference-head-style
|
|
(let [file-id (uuid/next)
|
|
page-id (uuid/next)
|
|
group-id (uuid/next)
|
|
child-a (uuid/next)
|
|
child-b (uuid/next)
|
|
state (-> (fb/create-state)
|
|
(fb/add-file {:id file-id :name "Test file"})
|
|
(fb/add-page {:id page-id :name "Page 1"})
|
|
(fb/add-group {:id group-id :name "Group A"})
|
|
(fb/add-shape {:id child-a
|
|
:type :rect
|
|
:name "A"
|
|
:x 0
|
|
:y 0
|
|
:width 10
|
|
:height 10
|
|
:strokes (stroke "#ff0000")})
|
|
(fb/add-shape {:id child-b
|
|
:type :rect
|
|
:name "B"
|
|
:x 20
|
|
:y 0
|
|
:width 10
|
|
:height 10
|
|
:strokes (stroke "#00ff00")})
|
|
(fb/close-group)
|
|
(fb/add-bool {:group-id group-id
|
|
:type :difference}))
|
|
bool (fb/get-shape state group-id)]
|
|
(t/is (= :bool (:type bool)))
|
|
(t/is (= (stroke "#ff0000") (:strokes bool)))))
|
|
|
|
(t/deftest add-file-media-validates-and-persists-media
|
|
(let [file-id (uuid/next)
|
|
page-id (uuid/next)
|
|
image-id (uuid/next)
|
|
state (-> (fb/create-state)
|
|
(fb/add-file {:id file-id :name "Test file"})
|
|
(fb/add-page {:id page-id :name "Page 1"})
|
|
(fb/add-file-media {:id image-id
|
|
:name "Image"
|
|
:width 128
|
|
:height 64}
|
|
(fb/map->BlobWrapper {:mtype "image/png"
|
|
:size 42
|
|
:blob nil})))
|
|
media (get-in state [::fb/file-media image-id])]
|
|
(t/is (= image-id (::fb/last-id state)))
|
|
(t/is (= "Image" (:name media)))
|
|
(t/is (= 128 (:width media)))
|
|
(t/is (= 64 (:height media)))))
|
|
|
|
(t/deftest add-shape-normalizes-path-name
|
|
(let [file-id (uuid/next)
|
|
page-id (uuid/next)
|
|
shape-id (uuid/next)
|
|
state (-> (fb/create-state)
|
|
(fb/add-file {:id file-id :name "Test file"})
|
|
(fb/add-page {:id page-id :name "Page 1"})
|
|
(fb/add-shape {:id shape-id
|
|
:type :frame
|
|
:name "Group/Subgroup / Name"
|
|
:x 0
|
|
:y 0
|
|
:width 10
|
|
:height 10}))
|
|
shape (fb/get-shape state shape-id)]
|
|
(t/is (= "Group / Subgroup / Name" (:name shape)))))
|