add boolean attributes

src/happyx/core/constants.nim

@@ -93,6 +93,13 @@ const
     "table", "tbody", "td", "template", "textarea", "tfoot", "th", "thead", "time",
     "title", "tr", "track", "text", "u", "ul", "var", "video", "wbr",
   ]
+  htmlNonBoolAttrs* = [
+    "class", "id", "color", "border", "bgcolor", "charset", "accept", "accept-charset",
+    "action", "allow", "accesskey", "http-equip", "kind", "lang", "language", "itemprop",
+    "list", "type", "minlength", "maxlength", "placeholder", "role", "rows", "cols", "score",
+    "src", "srcdoc", "srclang", "href", "ref", "summary", "step", "title", "translate",
+    "width", "height", "wrap", "target", "srcset"
+  ]
   availableCryptoMethods = ["sha224", "sha256", "sha384", "sha512"]
   # Nim version
   nim_1_6_14* = (NimMajor, NimMajor, NimPatch) == (1, 6, 14)
@@ -123,7 +130,7 @@ when defined(js):
 
 
 when int(enableHttpx) + int(enableMicro) + int(enableHttpBeast) > 1:
-  {. error: "You can't use two alternative servers at one time!" .}
+  {. error: "You can't use two or more alternative servers at one time!" .}
 
 
 when enableDebug:

src/happyx/private/macro_utils.nim

@@ -487,9 +487,15 @@ proc attribute*(attr: NimNode, inComponent: bool = false): NimNode =
           )
         else:
           attr[1]
+    v = newNimNode(nnkWhenStmt).add(newNimNode(nnkElifBranch).add(
+      newCall("is", newCall("typeof", v), ident"bool"),
+      newCall("$", formatNode(v))
+    ), newNimNode(nnkElse).add(
+      formatNode(v)
+    ))
     newColonExpr(
       newLit(k),
-      formatNode(v)
+      v
     )
 
 
@@ -535,6 +541,12 @@ proc addAttribute*(node, key, value: NimNode, inComponent: bool = false) =
         )
       else:
         value
+  v = newNimNode(nnkWhenStmt).add(newNimNode(nnkElifBranch).add(
+    newCall("is", newCall("typeof", v), ident"bool"),
+    newCall("$", v)
+  ), newNimNode(nnkElse).add(
+    v
+  ))
   if node.kind == nnkCall:
     if node.len == 2:
       node.add(newCall("newStringTable", newNimNode(nnkTableConstr).add(

src/happyx/spa/tag.nim

@@ -31,7 +31,8 @@ import
   std/strformat,
   std/strtabs,
   std/htmlparser,
-  std/xmltree
+  std/xmltree,
+  ../core/constants
 
 
 when defined(js):
@@ -200,10 +201,24 @@ when defined(js):
         {.emit: "`e`.setAttributeNS(null, 'class', `a`);".}
       for key, val in attrs.pairs:
         if key != "class":
-          e.setAttribute(cstring(key), cstring(val))
+          if key in htmlNonBoolAttrs:
+            e.setAttribute(cstring(key), cstring(val))
+          elif val.toLowerAscii() == "true":
+            e.setAttribute(cstring(key), "")
+          elif val.toLowerAscii() == "false":
+            discard
+          else:
+            e.setAttribute(cstring(key), cstring(val))
     else:
       for key, val in attrs.pairs:
-        e.setAttribute(cstring(key), cstring(val))
+        if key in htmlNonBoolAttrs:
+          e.setAttribute(cstring(key), cstring(val))
+        elif val.toLowerAscii() == "true":
+          e.setAttribute(cstring(key), "")
+        elif val.toLowerAscii() == "false":
+          discard
+        else:
+          e.setAttribute(cstring(key), cstring(val))
 
   proc newElement(name: string): TagRef {.exportc: "nwelm".} =
     if name.toLower() in SvgElements:

tests/index8.html

@@ -18,4 +18,4 @@
       padding: 0;
     }
   </style>
-</html>
+</html>

tests/testjs12.nim

@@ -37,4 +37,4 @@ var test1 = use component CTest(id = 1)
 appRoutes("app"):
   "/":
     tDiv: component test1
-    tDiv: component CTest(id = 7)
+    tDiv: component CTest(id = 7)

tests/testjs8.nim

@@ -16,3 +16,5 @@ appRoutes("app"):
       "click me"
       @click:
         counter += 1
+
+    tInput(readonly = counter.val mod 2 == 0)