Trying to handle blur event and get at event.target.textContent as a String

A.elm

module A exposing (..)

import Debug
import Html
import Html exposing (..)
import Html.Attributes exposing (..)
import Html.Events exposing (onBlur, onClick, on)
import Json.Decode as JD
import Json.Encode as JE


main =
    Html.program
        { init = init
        , view = view
        , update = update
        , subscriptions = subscriptions
        }


type alias Model =
    {}



-- type alias TextContent = String


init : ( Model, Cmd Msg )
init =
    ( {}, Cmd.none )


type Msg
    = Noop
    | Blur String


update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        Noop ->
            ( model, Cmd.none )

        Blur x ->
            let
                _ =
                    Debug.log "blur3" x
            in
                ( model, Cmd.none )


subscriptions : Model -> Sub Msg
subscriptions model =
    Sub.none



-- decodeText =
--     JD.at [ "target", "textContent" ] JD.string


textContent : JD.Decoder String
textContent =
    (JD.at [ "target", "textContent" ] JD.string)



-- onBlur2 : Msg -> Attribute (Msg String)
-- onBlur2 event =
--     let
--         _ =
--             Debug.log "hey onBlur3" event
--     in
--         on "blur" decodeText event


onBlur3 event =
    on "keydown" textContent


view : Model -> Html Msg
view model =
    div []
        [ p [ onBlur3 Blur, contenteditable True ] [ text "Hello World" ]
        , button [] [ text "click" ]
        ]