results of TDDing a todo list in Elm

elm.json

{
    "type": "application",
    "source-directories": [
        "src"
    ],
    "elm-version": "0.19.0",
    "dependencies": {
        "direct": {
            "elm/browser": "1.0.1",
            "elm/core": "1.0.2",
            "elm/html": "1.0.0"
        },
        "indirect": {
            "elm/json": "1.1.3",
            "elm/time": "1.0.0",
            "elm/url": "1.0.0",
            "elm/virtual-dom": "1.0.2"
        }
    },
    "test-dependencies": {
        "direct": {
            "elm-explorations/test": "1.2.1"
        },
        "indirect": {
            "elm/random": "1.0.0"
        }
    }
}

Example.elm

module Example exposing (suite)

import Expect
import Html.Attributes
import Main
import Test exposing (Test, describe, test)
import Test.Html.Event as Event
import Test.Html.Query as Query
import Test.Html.Selector exposing (attribute, tag, text)


suite : Test
suite =
    describe "to do list"
        [ test "has a form" <|
            \_ ->
                Main.init
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.has [ tag "form" ]
        , test "form has a text input" <|
            \_ ->
                Main.init
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "form" ]
                    |> Query.has [ tag "input" ]
        , test "form has a submit button" <|
            \_ ->
                Main.init
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "form" ]
                    |> Query.has
                        [ tag "button"
                        , text "Add"
                        , attribute <| Html.Attributes.type_ "submit"
                        ]
        , test "has a list" <|
            \_ ->
                Main.init
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.has [ tag "ul" ]
        , test "list starts empty" <|
            \_ ->
                Main.init
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "ul" ]
                    |> Query.children []
                    |> Query.count (Expect.equal 0)
        , test "button starts disabled" <|
            \_ ->
                Main.init
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "button" ]
                    |> Query.has [ attribute <| Html.Attributes.disabled True ]
        , test "text input has an input handler" <|
            \_ ->
                Main.init
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "input" ]
                    |> Event.simulate (Event.input "foo")
                    |> Event.expect (Main.Input "foo")
        , test "typing in the input enables the button" <|
            \_ ->
                Main.init
                    |> Main.update (Main.Input "foo")
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "button" ]
                    |> Query.has [ attribute <| Html.Attributes.disabled False ]
        , test "form has a submit handler" <|
            \_ ->
                Main.init
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "form" ]
                    |> Event.simulate Event.submit
                    |> Event.expect Main.Submit
        , test "submitting the form adds the input to the todo list" <|
            \_ ->
                Main.init
                    |> Main.update (Main.Input "foo")
                    |> Main.update Main.Submit
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "ul" ]
                    |> Query.children []
                    |> Expect.all
                        [ Query.count (Expect.equal 1)
                        , Query.first
                            >> Query.has [ tag "li", text "foo" ]
                        ]
        , test "typing in the input updates the value" <|
            \_ ->
                Main.init
                    |> Main.update (Main.Input "foo")
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "input" ]
                    |> Query.has [ attribute <| Html.Attributes.value "foo" ]
        , test "submitting the form clears the input text" <|
            \_ ->
                Main.init
                    |> Main.update (Main.Input "foo")
                    |> Main.update Main.Submit
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "input" ]
                    |> Query.has [ attribute <| Html.Attributes.value "" ]
        , test "can add two todos" <|
            \_ ->
                Main.init
                    |> Main.update (Main.Input "foo")
                    |> Main.update Main.Submit
                    |> Main.update (Main.Input "bar")
                    |> Main.update Main.Submit
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "ul" ]
                    |> Query.children []
                    |> Expect.all
                        [ Query.count (Expect.equal 2)
                        , Query.first
                            >> Query.has [ tag "li", text "foo" ]
                        , Query.index 1
                            >> Query.has [ tag "li", text "bar" ]
                        ]
        , test "todo item has checkbox" <|
            \_ ->
                Main.init
                    |> Main.update (Main.Input "foo")
                    |> Main.update Main.Submit
                    |> Main.view
                    |> Query.fromHtml
                    |> Query.find [ tag "ul" ]
                    |> Query.children []
                    |> Query.first
                    |> Query.has
                        [ tag "input"
                        , attribute <| Html.Attributes.type_ "checkbox"
                        ]
        ]

Main.elm

module Main exposing (Msg(..), init, main, update, view)

import Browser
import Html exposing (Html)
import Html.Attributes exposing (disabled, type_, value)
import Html.Events exposing (onInput, onSubmit)


type alias Model =
    { input : String
    , todos : List String
    }


type Msg
    = Input String
    | Submit


main : Program () Model Msg
main =
    Browser.sandbox
        { init = init
        , update = update
        , view = view
        }


init : Model
init =
    { input = "", todos = [] }


update : Msg -> Model -> Model
update msg model =
    case msg of
        Input s ->
            { model | input = s }

        Submit ->
            { todos = model.todos ++ [ model.input ], input = "" }


view : Model -> Html Msg
view model =
    Html.div []
        [ Html.form
            [ onSubmit Submit ]
            [ Html.input [ onInput Input, value model.input ] []
            , Html.button
                [ disabled <| String.isEmpty model.input
                , type_ "submit"
                ]
                [ Html.text "Add" ]
            ]
        , Html.ul [] <| items model
        ]


items : Model -> List (Html Msg)
items model =
    List.map (\s -> Html.li [] [ Html.text s ]) model.todos