Skip to content

Commit

Permalink
Add explicit tests for "complex" defkeyframes forms (#20)
Browse files Browse the repository at this point in the history
Any form that needs top level language structures (like `(let)`) instead
of directly emitting their garden forms are "complex." For style
declarations like defclass, we can rely on garden's support for `[:&]`
as a self-referential symbol to handle these cases. `(at-keyframes)`
*could* support this symbol, but per API expects a variadic sequence of
rules, eg `(at-keyframes [:from {:opacity 0}] [:to {:opacity 1}])`.

In the currently published version of garden, `defkeyframes` sort of
abuses the fact that it incorrectly also accepts a list containing the
sequence of rules. However, there's an unpublished change that "fixes"
this bug, breaking defkeyframes. Relatedly, our unofficial support for
manual `^{:key key}` meta on the first rule doesn't work with
complex `defkeyframes`. I'm not *the most* worried about that, but we'll
definitely need to fix the first issue, so if we can fix the second
while we're there, we might as well.
  • Loading branch information
dhleong authored Nov 1, 2024
1 parent d62ad3f commit e3ee554
Showing 1 changed file with 56 additions and 2 deletions.
58 changes: 56 additions & 2 deletions test/spade/core_test.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,9 @@
composed-factory$
composed-list-factory$
composed-attrs-factory$
parameterized-key-frames-factory$)
parameterized-key-frames-factory$
complex-keyframes-factory$
multi-complex-keyframes-factory$)

(defclass computed-key [color]
^{:key (str/upper-case color)}
Expand Down Expand Up @@ -123,6 +125,29 @@
:opacity ::*from*}]
[:to {:opacity 1}])

(defkeyframes complex-keyframes [from]
(let [k (* 2 from)]
^{:key k}
; NOTE: This :& form is not *really* supported by garden's
; (at-keyframes) function, but it is a familiar syntax for
; the other def* forms, so let's make it work here so we can
; support complex forms with a shared computation.
[:&
[:from {::*from* from
:opacity ::*from*}]
[:to {:opacity 1}]]))

(defkeyframes multi-complex-keyframes [from]
(let [k (* 2 from)]
^{:key k}
; NOTE: This :& form is not *really* supported by garden's
; (at-keyframes) function, but it is a familiar syntax for
; the other def* forms, so let's make it work here so we can
; support complex forms with a shared computation.
[:from {::*from* from
:opacity ::*from*}])
[:to {:opacity 1}])

(deftest defkeyframes-test
(testing "Return keyframes name from defkeyframes"
(is (fn? key-frames))
Expand All @@ -134,6 +159,14 @@
(is (= (str "spade-core-test-parameterized-key-frames_" (hash [0]))
(parameterized-key-frames 0))))

(testing "Return dynamic name for complex defkeyframes"
(is (fn? complex-keyframes))
(is (fn? multi-complex-keyframes))
(is (= (str "spade-core-test-complex-keyframes_84")
(complex-keyframes 42)))
(is (= (str "spade-core-test-multi-complex-keyframes_84")
(multi-complex-keyframes 42))))

(testing "CSS var declaration and usage"
(let [generated (-> (parameterized-key-frames-factory$
"with-vars" [42])
Expand All @@ -147,7 +180,28 @@
" }")))
(is (str/includes?
generated
(str "to { opacity: 1; }"))))))
(str "to { opacity: 1; }")))))

(testing "CSS var declaration and usage within a block"
; NOTE: The styles generated should be identical to above
(let [generated (-> (complex-keyframes-factory$
"with-vars" [42])
:css
(str/replace #"\s+" " "))
multi-generated (-> (multi-complex-keyframes-factory$
"with-vars" [42])
:css
(str/replace #"\s+" " "))]
(is (str/includes?
generated
(str "from {"
" --spade-core-test--from: 42;"
" opacity: var(--spade-core-test--from);"
" }")))
(is (str/includes?
generated
(str "to { opacity: 1; }")))
(is (= generated multi-generated)))))

(defclass composed [color]
^{:key color}
Expand Down

0 comments on commit e3ee554

Please sign in to comment.