Calling DOM methods from Elm

Learn
15

I’d recommend against using the is syntax if you need to support Safari as well, they don’t support customizing built-ins.

What we have been doing at work for elements that don’t need to actually add/replace children is render the elements inside the custom element, and then look them up.

Updated ellie: https://ellie-app.com/8MdS5ytWnyqa1

image

For this module it would probably go in ValidInput.elm and you might expose it with an API using the “unAttr” pattern like Ellie does to restrict the public API

validInput: Model -> Html Msg
validInput model =]
    ValidInput.view 
        [ ValidInput.validity "custom validity message"
        , ValidInput.value model.value
        , ValidInput.onChange SetValue
        ]

The ValidInput module would make sure that an input is rendered, that attributes/properties are encoded correctly, etc.

3 Likes