Fix VDOM attributes not accepting all numeric types

Author: japgolly

core/src/main/scala/japgolly/scalajs/react/vdom/Implicits.scala

@@ -28,13 +28,15 @@ trait ImplicitsForVdomAttr extends ImplicitsForVdomAttr1 {
   import Attr.ValueType
   import ValueType._
 
-  implicit val vdomAttrVtBoolean: Simple[Boolean] = byImplicit
-
-  implicit val vdomAttrVtString: Simple[String] = string
-
-  implicit val vdomAttrVtInt: Simple[Int] = byImplicit
-
-  implicit val vdomAttrVtJsObject: Simple[js.Object] = direct
+  implicit      val vdomAttrVtBoolean : Simple[Boolean  ] = byImplicit
+  implicit      val vdomAttrVtString  : Simple[String   ] = string
+  implicit      val vdomAttrVtInt     : Simple[Int      ] = byImplicit
+  implicit lazy val vdomAttrVtLong    : Simple[Long     ] = byImplicit
+  implicit lazy val vdomAttrVtFloat   : Simple[Float    ] = byImplicit
+  implicit lazy val vdomAttrVtDouble  : Simple[Double   ] = byImplicit
+  implicit lazy val vdomAttrVtShort   : Simple[Short    ] = byImplicit
+  implicit lazy val vdomAttrVtByte    : Simple[Byte     ] = byImplicit
+  implicit      val vdomAttrVtJsObject: Simple[js.Object] = direct
 
   @inline implicit def vdomAttrVtJsDictionary[A]: ValueType[js.Dictionary[A], js.Object] = byImplicit
 

doc/changelog/1.1.0.md

@@ -5,6 +5,8 @@
 
 * Fix React warnings with SVG VDOM.
 
+* Fix VDOM attributes not accepting types: `Byte`, `Short`, `Float`, `Double`, `Long`
+
 * Refactored `vdom.Builder` which is an internal mechanism for efficiently composing VDOM.
   There is now:
   * An interface - advanced users can create their own if they like

test/src/test/scala/japgolly/scalajs/react/core/vdom/PrefixedTest.scala

@@ -53,9 +53,24 @@ object PrefixedTest extends TestSuite {
     'styleDict  - test(<.div(^.style := js.Dictionary("x" -> "y")), """<div style="x:y;"></div>""")
     'styleAttrs - test(<.div(^.color := "red", ^.cursor.auto),      """<div style="color:red;cursor:auto;"></div>""")
 
-    'boolean {
-      't - test(<.div(^.disabled := true), """<div disabled=""></div>""")
-      'f - test(<.div(^.disabled := false), """<div></div>""")
+    'attr {
+      'any {
+        def aa: VdomAttr[Any] = ^.profile
+        def as = "profile"
+        'short     - test(<.div(aa := (45: Short)), s"""<div $as="45"></div>""")
+        'byte      - test(<.div(aa := (50: Byte)),  s"""<div $as="50"></div>""")
+        'int       - test(<.div(aa := 666),         s"""<div $as="666"></div>""")
+        'long      - test(<.div(aa := 123L),        s"""<div $as="123"></div>""")
+        'float     - test(<.div(aa := 321f),        s"""<div $as="321"></div>""")
+        'double    - test(<.div(aa := 12.3),        s"""<div $as="12.3"></div>""")
+        'string    - test(<.div(aa := "yo"),        s"""<div $as="yo"></div>""")
+        'booleanT  - test(<.div(aa := true),        s"""<div $as="true"></div>""")
+        'booleanF  - test(<.div(aa := false),       s"""<div $as="false"></div>""")
+      }
+      'boolean {
+        't - test(<.div(^.disabled := true), """<div disabled=""></div>""")
+        'f - test(<.div(^.disabled := false), """<div></div>""")
+      }
     }
 
     'VdomArray {

test/src/test/scala/japgolly/scalajs/react/core/vdom/UnprefixedTest.scala

@@ -55,9 +55,24 @@ object UnprefixedTest extends TestSuite {
     'styleDict  - test(div(style := js.Dictionary("x" -> "y")), """<div style="x:y;"></div>""")
     'styleAttrs - test(div(color := "red", cursor.auto),        """<div style="color:red;cursor:auto;"></div>""")
 
-    'boolean {
-      't - test(div(disabled := true), """<div disabled=""></div>""")
-      'f - test(div(disabled := false), """<div></div>""")
+    'attr {
+      'any {
+        def aa: VdomAttr[Any] = profile
+        def as = "profile"
+        'short     - test(div(aa := (45: Short)), s"""<div $as="45"></div>""")
+        'byte      - test(div(aa := (50: Byte)),  s"""<div $as="50"></div>""")
+        'int       - test(div(aa := 666),         s"""<div $as="666"></div>""")
+        'long      - test(div(aa := 123L),        s"""<div $as="123"></div>""")
+        'float     - test(div(aa := 321f),        s"""<div $as="321"></div>""")
+        'double    - test(div(aa := 12.3),        s"""<div $as="12.3"></div>""")
+        'string    - test(div(aa := "yo"),        s"""<div $as="yo"></div>""")
+        'booleanT  - test(div(aa := true),        s"""<div $as="true"></div>""")
+        'booleanF  - test(div(aa := false),       s"""<div $as="false"></div>""")
+      }
+      'boolean {
+        't - test(div(disabled := true), """<div disabled=""></div>""")
+        'f - test(div(disabled := false), """<div></div>""")
+      }
     }
 
     'VdomArray {