elm.json

@@ -20,7 +20,16 @@
         }
     },
     "test-dependencies": {
-        "direct": {},
-        "indirect": {}
+        "direct": {
+            "elm-explorations/test": "1.2.2",
+            "avh4/elm-program-test": "3.1.0"
+        },
+        "indirect": {
+            "avh4/elm-fifo": "1.0.4",
+            "elm/bytes": "1.0.8",
+            "elm/file": "1.0.5",
+            "elm/http": "2.0.0",
+            "elm/random": "1.0.0"
+        }
     }
-}
\ No newline at end of file
+}

package.json

 {
-  "name": "elm-starter",
-  "version": "1.0.0",
-  "description": "An elm starter template repository",
-  "keywords": [
-    "elm",
-    "template repository"
-  ],
-  "author": "Ryan Frazier",
-  "license": "MIT",
-  "devDependencies": {
-    "elm-live": "^4.0.1"
-  }
-}
+    "name": "elm-calculator",
+    "version": "1.0.0",
+    "description": "An elm starter template repository",
+    "scripts": {
+        "build": "mkdir -p dist && elm make src/Main.elm --optimize --output=dist/elm.js && cp index.html dist && cp style.css dist"
+    },
+    "keywords": [
+        "elm",
+        "template repository"
+    ],
+    "author": "Ryan Frazier",
+    "license": "MIT",
+    "devDependencies": {
+        "elm": "^0.19.0-no-deps",
+        "elm-live": "^4.0.1",
+        "elm-test": "^0.19.0-rev6"
+    },
+    "dependencies": {}
+}
\ No newline at end of file

src/Main.elm

-module Main exposing (main)
+module Main exposing (Model, Msg, init, main, update, view)
 
 import Browser
 import Browser.Events exposing (onKeyDown)
@@ -22,8 +22,8 @@ type alias Model =
     }
 
 
-init : ( Model, Cmd Msg )
-init =
+init : () -> ( Model, Cmd Msg )
+init () =
     ( { stack = []
       , currentNum = "0"
       , error = Nothing
@@ -118,7 +118,7 @@ update msg model =
                 ( { model | currentNum = "-" ++ model.currentNum }, Cmd.none )
 
         ClearAll ->
-            init
+            init ()
 
         Clear ->
             ( { model | currentNum = "0", dirty = False }, Cmd.none )
@@ -375,27 +375,31 @@ inputBox num =
         ]
 
 
-view : Model -> Html Msg
+view : Model -> Browser.Document Msg
 view model =
-    div []
-        [ h1 [ class "h1" ] [ text "RPN Calculator" ]
-        , div
-            [ class "calculator" ]
-            (List.repeat (3 - List.length model.stack) emptyBox
-                ++ List.map stackBox (List.reverse <| List.take 3 model.stack)
-                ++ [ inputBox <|
-                        case model.error of
-                            Nothing ->
-                                text model.currentNum
-
-                            Just err ->
-                                span [ class "error" ] [ text err ]
-                   , section
-                   ]
-            )
-
-        -- , div [] [ text <| Debug.toString model ]
+    { title = "Elm Calculator" 
+    , body =
+        [ div []
+            [ h1 [ class "h1" ] [ text "RPN Calculator" ]
+            , div
+                [ class "calculator" ]
+                (List.repeat (3 - List.length model.stack) emptyBox
+                    ++ List.map stackBox (List.reverse <| List.take 3 model.stack)
+                    ++ [ inputBox <|
+                            case model.error of
+                                Nothing ->
+                                    text model.currentNum
+
+                                Just err ->
+                                    span [ class "error" ] [ text err ]
+                    , section
+                    ]
+                )
+
+            -- , div [] [ text <| Debug.toString model ]
+            ]
         ]
+    }
 
 
 
@@ -404,9 +408,9 @@ view model =
 
 main : Program () Model Msg
 main =
-    Browser.element
+    Browser.document
         { view = view
-        , init = \_ -> init
+        , init = init
         , update = update
         , subscriptions = subscriptions
         }

tests/CalculatorTest.elm

+module CalculatorTest exposing (all)
+
+import Main
+import ProgramTest exposing (ProgramTest, clickButton, expectViewHas, fillIn, update, within)
+import Test exposing (..)
+import Test.Html.Query as Query
+import Test.Html.Selector exposing (class, text)
+
+
+start : ProgramTest Main.Model Main.Msg (Cmd Main.Msg)
+start =
+    ProgramTest.createDocument
+        { init = Main.init
+        , update = Main.update
+        , view = Main.view
+        }
+        |> ProgramTest.start ()
+
+
+clickCalcBtn : String -> ProgramTest model msg effect -> ProgramTest model msg effect
+clickCalcBtn btnText =
+    within (Query.find [ class "section" ]) (clickButton btnText)
+
+
+all : Test
+all =
+    describe "basic arithmetic"
+        [ test "20 × 3 = 60" <|
+            \() ->
+                start
+                    |> clickCalcBtn "2"
+                    |> clickCalcBtn "0"
+                    |> clickCalcBtn "↵"
+                    |> clickCalcBtn "3"
+                    |> clickCalcBtn "×"
+                    |> expectViewHas
+                        [ text "60"
+                        ]
+        ]