Fix #433, support className property with keyword class shortcut

This commit is contained in:
Juho Teperi 2020-04-16 23:36:02 +03:00
parent 28aaf6e467
commit 3ee1d65aa5
3 changed files with 9 additions and 1 deletions

View File

@ -4,6 +4,7 @@
- Fixed merge-props adding `:class` property to result even if no argument - Fixed merge-props adding `:class` property to result even if no argument
defined `:class` ([#479](https://github.com/reagent-project/reagent/pull/479)) defined `:class` ([#479](https://github.com/reagent-project/reagent/pull/479))
- Fix using `:className` property together with keyword class shortcut ([#433](https://github.com/reagent-project/reagent/issues/433))
## 0.10.0 (2020-03-06) ## 0.10.0 (2020-03-06)

View File

@ -109,7 +109,10 @@
;; Merge classes ;; Merge classes
class class
(assoc :class (util/class-names class (:class props)))))) ;; Note: someone might use React-style :className property,
;; this is the only place where that needs special case. Using
;; :class and :className together is not supported.
(assoc :class (util/class-names class (or (:class props) (:className props)))))))
(defn convert-props [props ^clj id-class] (defn convert-props [props ^clj id-class]
(let [class (:class props) (let [class (:class props)

View File

@ -302,6 +302,10 @@
(as-string [:div.foo {:class "bar"}]))) (as-string [:div.foo {:class "bar"}])))
(is (= "<div class=\"foo bar\"></div>" (is (= "<div class=\"foo bar\"></div>"
(as-string [:div.foo.bar]))) (as-string [:div.foo.bar])))
(is (= "<div class=\"foo bar\"></div>"
(as-string [:div.foo {:className "bar"}])))
(is (= "<div class=\"foo bar\"></div>"
(as-string [:div {:className "foo bar"}])))
(is (re-find #"id=.foo" (is (re-find #"id=.foo"
(as-string [:div#foo.foo.bar]))) (as-string [:div#foo.foo.bar])))
(is (re-find #"class=.xxx bar" (is (re-find #"class=.xxx bar"