raquo / Snabbdom.scala

Virtual DOM for Scala.js based on Snabbdom.js
MIT License
8 stars 1 forks source link

svg support #6

Closed gregor-i closed 5 years ago

gregor-i commented 5 years ago

Hi,

I'm currently migrating a snabbdom project to snabbdom.scala. I found an issue with svgs. Maybe you can supply a solution to that problem:

snabbdom does some magic in it's h-function, that sets the namespace for svg elements. See: https://github.com/snabbdom/snabbdom/blob/v0.7.3/src/h.ts#L42 As far as I know, snabbdom.scala doesn't use that function so the namespace won't be set. Without the namespace, I can't set some attributes (like viewBox) as the xml relies on case sensitivity and normal html elements are case insensitive.

raquo commented 5 years ago

Hey, unfortunately I've abandoned Snabdom.scala before I got to implementing SVG for it. I guess I should archive this project since I won't be maintaining it...

A bunch of work would be needed to add SVG support to Snabbdom.scala. For one, you'd need to bump the Scala DOM Types dependency to the latest version which does have SVG definitions. Then you would need to make a Builder for SVG tags that would replicate the SVG namespace logic found in Snabbdom's h function.

Perhaps you can glean some lessons from the codebase of Outwatch – they have their own wrapper around Snabbdom, and also use Scala DOM Types.

gregor-i commented 5 years ago

I found a solution. I basically do the same as snabbdom's h-function:

// note: this has to be the appended after the last child.
class SetNameSpace(nameSpace: String) extends Modifier[VNode, VNodeData] {
  import scala.language.dynamics

  override def apply(v1: VNode): Unit = {
    v1.data.asInstanceOf[scala.scalajs.js.Dynamic].ns = nameSpace
    if(v1.maybeChildren.isDefined)
      v1.maybeChildren.get.foreach(apply)
  }
}

Anyway, it would be nice to mention in the readme that the project is abandoned, so people will not start relying on it. I will checkout outwatch.