Added test cases for spread attributes in HSX. Also fixed missing spa…

…ce in generated HTML of spread attributes
digitallyinduced · Dec 7, 2021 · 005efd5 · 005efd5
1 parent 0a0fba2
commit 005efd5
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 1 deletion.
diff --git a/IHP/HSX/QQ.hs b/IHP/HSX/QQ.hs
@@ -85,7 +85,7 @@ toStringAttribute (StaticAttribute name (ExpressionValue expression)) = let name
 toStringAttribute (SpreadAttributes expression) = [| spreadAttributes $(pure expression) |]
 
 spreadAttributes :: ApplyAttribute value => [(Text, value)] -> Html5.Html -> Html5.Html
-spreadAttributes attributes html = applyAttributes html $ map (\(name, value) -> applyAttribute name (name <> "=\"") value) attributes
+spreadAttributes attributes html = applyAttributes html $ map (\(name, value) -> applyAttribute name (" " <> name <> "=\"") value) attributes
 
 applyAttributes :: Html5.Html -> [Html5.Html -> Html5.Html] -> Html5.Html
 applyAttributes element attributes = foldl' (\element attribute -> attribute element) element attributes

diff --git a/Test/HSX/ParserSpec.hs b/Test/HSX/ParserSpec.hs
@@ -57,3 +57,8 @@ tests = do
         it "should collapse spaces" do
             let p = parseHsx position "\n    Hello\n    World\n    !    "
             p `shouldBe`  (Right (Children [TextNode "Hello World !"]))
+
+        it "should parse spread values" do
+            let p = parseHsx position "<div {...variables}/>"
+            -- We cannot easily construct the @VarE variables@ expression, therefore we use show here for comparison
+            tshow p `shouldBe` "Right (Children [Node \"div\" [SpreadAttributes (VarE variables)] [] False])"
diff --git a/Test/HSX/QQSpec.hs b/Test/HSX/QQSpec.hs
@@ -153,6 +153,17 @@ tests = do
                 </html>
             |] `shouldBeHtml` "<html><head><meta charset=\"utf-8\"> <link rel=\"stylesheet\" href=\"/vendor/bootstrap.min.css\"><link rel=\"stylesheet\" href=\"/vendor/flatpickr.min.css\"><link rel=\"stylesheet\" href=\"/app.css\"> <script src=\"/prod.js\"></script><title>IHP Forum</title></head><body><div class=\"container mt-4\"><nav class=\"navbar navbar-expand-lg navbar-light mb-4\"><a class=\"navbar-brand\" href=\"/\">\955 IHP Forum</a></nav></div></body></html>"
 
+        it "should handle spread attributes with a variable" do
+            let customAttributes :: [(Text, Text)] = [
+                    ("hello", "world")
+                    ]
+            [hsx|<div {...customAttributes}></div>|] `shouldBeHtml` "<div hello=\"world\"></div>"
+
+        it "should handle spread attributes with a list" do
+            -- See https://github.com/digitallyinduced/ihp/issues/1226
+
+            [hsx|<div {...[ ("data-hoge" :: Text, "Hello World!" :: Text) ]}></div>|] `shouldBeHtml` "<div data-hoge=\"Hello World!\"></div>"
+
 data Project = Project { name :: Text }
 
 shouldBeHtml hsx expectedHtml = (Blaze.renderMarkup hsx) `shouldBe` expectedHtml