Fix #262: Apply metadata to outermost el when using nesting shorthand

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## Unreleased
+
+- Apply vector metadata to the outermost element when using nesting shorthard ([#262](https://github.com/reagent-project/reagent/issues/262))
+
 ## 0.8.0-alpha2 (2017-10-20)
 
 **[compare](https://github.com/reagent-project/reagent/compare/v0.8.0-alpha1...v0.8.0-alpha2)**

src/reagent/impl/template.cljs

@@ -441,8 +441,12 @@
                       (hiccup-err v "Expected React component in"))
               (native-element #js{:name comp} v 2))
           ;; Support extended hiccup syntax, i.e :div.bar>a.foo
-          (recur [(subs n 0 pos)
+          ;; Apply metadata (e.g. :key) to the outermost element.
-                  (assoc v 0 (subs n (inc pos)))])))
+          ;; Metadata is probably used only with sequeneces, and in that case
+          ;; only the key of the outermost element matters.
+          (recur (with-meta [(subs n 0 pos)
+                             (assoc (with-meta v nil) 0 (subs n (inc pos)))]
+                            (meta v)))))
 
       (instance? NativeWrapper tag)
       (native-element tag v 1)

test/reagenttest/testreagent.cljs

@@ -556,6 +556,17 @@
   (is (= (rstr [:div>p.bar.foo>a.foobar {:href "href"} "xy"])
          (rstr [:div [:p.bar.foo [:a.foobar {:href "href"} "xy"]]]))))
 
+(deftest extended-syntax-metadata
+  (when r/is-client
+    (let [comp (fn []
+                 [:div
+                  (for [k [1 2]]
+                    ^{:key k} [:div>div "a"])])]
+      (with-mounted-component [comp]
+        (fn [c div]
+          ;; Just make sure this doesn't print a debug message
+          )))))
+
 (deftest test-class-from-collection
   (is (= (rstr [:p {:class ["a" "b" "c" "d"]}])
          (rstr [:p {:class "a b c d"}])))