Valid code with Runtime exception

[andre-dietrich]

Actually I was playing around with RDFa and Microdata as HTML attributes and by accident I discovered a bug, which is actually not a bug, since no one would use such a parameter. I was just wondering if, someone else had discovered this and how HTML parsers, written in elm might reproduce this error:

import Html exposing (div, text)
import Html.Attributes exposing (attribute)

main =
  div [ attribute "@style" "color: red" ]
      [ text "Hello!" ]

Unfortunately I cannot post a screenshot of the result, but it looks like this:

Initialization Error
InvalidCharacterError: String contains an invalid character

> Uncaught DOMException: String contains an invalid character

… which is the same as if you use javascript elem.setAttribute("@style", "color: red") …

[andre-dietrich]

I mean, it is not just the warning, it crashes the entire program …

[lydell]

Yep, the DOM is very tricky. It’s possible to crash things when using the functions that accept strings. Luckily, we can use the predefined Html.foo and Html.Attributes.foo functions 99 % of the time so we stay safe.

If you search for “runtime” in elm/html and elm/virtual-dom you’ll see a couple of open issues.

Here’s one issue showing that’s it’s difficult to “fix” or unclear how/if to fix sometimes: Runtime error: passing empty string to Html.Attributes.attribute · Issue #46 · elm/html · GitHub

---

It’s interesting that if you put <div @style="color: red">Hello!</div> in an HTML file, the browser will parse it. You can do .getAttribute("@style") to get "color: red" back, but .setAttribute("@style", "foo") throws an error (like you say). So the browser both does and does not let me use that at sign!

Which format uses @style?

[andre-dietrich]

I was trying out RDFa, within a book they used some @href and @hrel syntax within HTML, which does not seem to be correct, looking into the spec, which refers with @property to the properties itself.

But thanks for answering, it was just strange from a first glance, that a successfully compiled Elm-program crashed, after 4 years …

[rupert]

I suppose you could have:

module Html.Attribute exposing (..)

attribute : String -> String -> Maybe (Attribute msg)

and

module Html exposing (..)

node : String -> List (Maybe (Attribute msg)) -> List (Html msg) -> Html msg

So that doing this:

Html.node attrs innerHtml

becomes equivalent to doing this currently:

Html.node (attrs |> List.filterMap identity) innerHtml

I use List.filterMap identity on attribute lists quite often, since we don’t have an Attribute.none, although some people prefer to use an empty class name to cover that.

That would allow runtime checking of attribute names to ensure they are valid. On the other hand, its a big change to swallow from how things currently work.

A better way might be to have elm/virtual-dom internally have its own representation of a badly named attribute, and then silently ignore them. Changing the internal representation of attributes would yield a convenient place to implement Attribute.none too.