Filter out style properties with empty values (#10650)

* Filter out style properties with empty values

This caused CSS to break when `{:background-color nil}` was rendered as
`background-color: ;`.

* Use proper nil punning

* Convert `v` to string before passing to `seq`

src/metabase/pulse/render/style.clj

@@ -11,7 +11,8 @@
      (style {:font-weight 400, :color \"white\"}) -> \"font-weight: 400; color: white;\""
   [& style-maps]
   (str/join " " (for [[k v] (into {} style-maps)
-                      :let  [v (if (keyword? v) (name v) v)]]
+                      :let  [v (if (keyword? v) (name v) (str v))]
+                      :when (seq v)]
                   (str (name k) ": " v ";"))))
 
 (def ^:const color-brand

test/metabase/pulse/render/style_test.clj

+(ns metabase.pulse.render.style-test
+  (:require [expectations :refer [expect]]
+            [metabase.pulse.render.style :as style]))
+
+;; `style` should filter out nil values
+(expect
+  ""
+  (style/style {:a nil}))
+
+(expect
+  "a: 0; c: 2;"
+  (style/style {:a 0, :b nil, :c 2, :d ""}))

test/metabase/pulse/render/table_test.clj

@@ -56,8 +56,8 @@
 ;; we should find some similar basic values that can rely on. The goal isn't to test out the javascript choosing in
 ;; the color (that should be done in javascript) but to verify that the pieces are all connecting correctly
 (expect
-  {"1" "",                     "2" "",                     "3" "rgba(0, 255, 0, 0.75)"
-   "4" "",                     "5" "",                     "6" "rgba(0, 128, 128, 0.75)"
+  {"1" nil,                    "2" nil,                    "3" "rgba(0, 255, 0, 0.75)"
+   "4" nil,                    "5" nil,                    "6" "rgba(0, 128, 128, 0.75)"
    "7" "rgba(255, 0, 0, 0.65)" "8" "rgba(255, 0, 0, 0.2)"  "9" "rgba(0, 0, 255, 0.75)"}
   (let [query-results {:cols [{:name "a"} {:name "b"} {:name "c"}]
                        :rows [[1 2 3]