I've become stumped by a json decode issue where the code compiles
correctly but does not appear to actually run.
If you run this code below, open your console, enter anything in the
editable element and click out of it. I would expect the message `"Write!"`
to be logged but it is not. Equally the model is not updated.
Is this an issue with my code or is it a limitation of decoding child
nodes? The app works fine if refactored to take a model of `type alias
Model = { contents : String }` instead of a `List String`. As far as I can
tell the issue seems to lie with attempting to decode `childNodes`. Any
ideas?
Thanks!
import List exposing (map)
import Html exposing (beginnerProgram)
import Html exposing (Html, article, p)
import Html.Attributes exposing (style, contenteditable, spellcheck)
import Html.Events exposing (on)
import Json.Decode as Decode
main : Program Never Model Message
main =
beginnerProgram { model = model, view = view, update = update }
-- MODEL
type alias Model =
{ contents : List String }
model : Model
model =
{ contents =
[ "Lorem"
, "ipsum"
, "dolor"
]
}
-- UPDATE
type Message =
Write (List String)
update : Message -> Model -> Model
update message model =
case message of
Write contents ->
{ model | contents = Debug.log "Write!" contents }
-- VIEW
view : Model -> Html Message
view model =
article
[ contenteditable True
, spellcheck False
, on "blur" <| Decode.map Write <| childrenContentDecoder
]
(viewContents model.contents)
viewContents : List String -> List (Html a)
viewContents contents =
contents |> map (\content -> p [] [ Html.text content ])
childrenContentDecoder : Decode.Decoder (List String)
childrenContentDecoder =
Decode.at [ "target", "childNodes" ] (Decode.list textContentDecoder)
textContentDecoder : Decode.Decoder String
textContentDecoder =
Decode.field "textContent" Decode.string
--
You received this message because you are subscribed to the Google Groups "Elm
Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/d/optout.