US.3.About.page.creation

src/App/Models.elm

@@ -2,17 +2,20 @@ module Models exposing (..)
 
 import Routing.Router exposing (Route)
 import Views.Login.Model as LoginModel
+import Views.About.Model as AboutModel
 import Views.Messages exposing (MessagesModel, defaultMessagesModel)
 
 type alias Model =
     { route : Route
     , messages : MessagesModel
     , login : LoginModel.Model
+    , about : AboutModel.Model
     }
 
 initialModel : Route -> Model
 initialModel route =
     { route = route
     , messages = defaultMessagesModel
     , login = LoginModel.defaultModel
+    , about = AboutModel.defaultModel
     }

src/App/Routing/Router.elm

@@ -7,6 +7,7 @@ import UrlParser exposing (..)
 type Route
     = MessagesRoute
     | LoginRoute
+    | AboutRoute
     | NotFoundRoute
 
 
@@ -15,6 +16,7 @@ matchers =
     oneOf
         [ map MessagesRoute top
         , map LoginRoute (s "login")
+        , map AboutRoute (s "about")
         ]
 
 

src/App/View.elm

@@ -7,7 +7,7 @@ import Routing.Router exposing (Route(..))
 import Errors.ErrorViews exposing (notFoundView)
 import Views.Messages exposing (messagesView)
 import Views.Login.View as LoginView
-
+import Views.About.View as AboutView
 
 view : Model -> Html Msg
 view model =
@@ -16,5 +16,7 @@ view model =
             messagesView model.messages
         LoginRoute ->
             Html.map LoginMsg (LoginView.view model.login)
+        AboutRoute ->
+            AboutView.view model.about
         NotFoundRoute ->
             notFoundView

src/App/Views/About/Model.elm

@@ -0,0 +1,12 @@
+module Views.About.Model exposing (..)
+
+
+type alias Model =
+    { text : String
+    }
+
+
+defaultModel : Model
+defaultModel =
+    { text = "About"
+    }

src/App/Views/About/View.elm

@@ -0,0 +1,12 @@
+module Views.About.View exposing (..)
+
+import Html exposing (Html, div, text)
+import Views.About.Model exposing (Model)
+
+
+view : Model -> Html msg
+view model =
+    div [ ]
+      [ div [ ]
+          [ text model.text ]
+      ]

src/App/Views/Login/Model.elm

@@ -6,7 +6,6 @@ type alias Model =
     , intro : String
     , inputPlaceholder : String
     , submitLabel : String
-    , requiredPath : String
     }
 
 
@@ -16,5 +15,4 @@ defaultModel =
     , intro = "Has autem provincias, quas Orontes ambiens amnis imosque pedes Cassii montis illius celsi praetermeans funditur in Parthenium mare, Gnaeus Pompeius superato Tigrane regnis Armeniorum abstractas dicioni Romanae coniunxit."
     , inputPlaceholder = "Your username"
     , submitLabel = "Login"
-    , requiredPath = "hola"
     }

src/App/Views/Login/Update.elm

@@ -8,5 +8,5 @@ import Views.Login.Messages exposing (Msg(..))
 update : Msg -> Model -> ( Model, Cmd Msg )
 update msg model =
     case msg of
-        ChangeLocation requiredPath ->
-            ( { model | requiredPath = requiredPath }, Navigation.newUrl requiredPath )
+        ChangeLocation path ->
+            ( model, Navigation.newUrl path )

src/App/Views/Login/View.elm

@@ -2,7 +2,6 @@ module Views.Login.View exposing (..)
 
 import Html.CssHelpers
 import Html exposing (Html, div, img, p, text, form, button, input, a)
-import Html.Events exposing (onWithOptions)
 import Html.Attributes exposing (src, href, type_, autocomplete, placeholder, autofocus)
 
 import Css.AppCss exposing (CssClasses(..))
@@ -11,13 +10,11 @@ import Views.Login.Model exposing (Model)
 import Views.Login.Messages exposing (Msg(..))
 import Components.Link exposing (onLinkClick)
 
+
 { class } =
     Html.CssHelpers.withNamespace "microblog"
 
 
--- VIEW
-
-
 view : Model -> Html Msg
 view model =
     div [ class [ App ] ]

tests/Tests.elm

@@ -2,9 +2,11 @@ module Tests exposing (..)
 
 import Test exposing (..)
 import Views.LoginTest as LoginTest
+import Views.AboutTest as AboutTest
 
 all : Test
 all =
     describe "microblog-elm-tests"
             [ LoginTest.all
+            , AboutTest.all
             ]

tests/Views/AboutTest.elm

@@ -0,0 +1,24 @@
+module Views.AboutTest exposing (all)
+
+import Test exposing (..)
+import Test.Html.Query as Query
+import Test.Html.Selector exposing (..)
+
+import Views.About.Model exposing (defaultModel)
+import Views.About.View exposing (view)
+
+
+all : Test
+all =
+    let
+        aboutComponent =
+            view defaultModel
+                |> Query.fromHtml
+    in
+        describe "About component view"
+            [ test "Should contain the correct text" <|
+                \() ->
+                    aboutComponent
+                        |> Query.find [ tag "div" ]
+                        |> Query.has [ text defaultModel.text ]
+            ]

tests/Views/LoginTest.elm

@@ -4,30 +4,36 @@ import Test exposing (..)
 import Test.Html.Query as Query
 import Test.Html.Selector exposing (..)
 
-import Views.Login exposing (loginView, defaultLoginModel)
+import Views.Login.View exposing (view)
+import Views.Login.Model exposing (defaultModel)
 
 
 all : Test
 all =
     let
         loginComponent =
-            loginView defaultLoginModel
+            view defaultModel
                 |> Query.fromHtml
     in
         describe "view loginView"
             [ test "Form should have correct image" <|
                 \() ->
                     loginComponent
                         |> Query.find [ tag "img" ]
-                        |> Query.has [ attribute "src" "https://avatars0.githubusercontent.com/u/4359353?v=3&s=200" ]
+                        |> Query.has [ attribute "src" defaultModel.logo ]
             , test "Form should have correct intro" <|
                 \() ->
                     loginComponent
                         |> Query.find [ tag "p" ]
-                        |> Query.has [ text "Has autem provincias, quas Orontes ambiens amnis imosque pedes Cassii montis illius celsi praetermeans funditur in Parthenium mare, Gnaeus Pompeius superato Tigrane regnis Armeniorum abstractas dicioni Romanae coniunxit." ]
+                        |> Query.has [ text defaultModel.intro ]
             , test "Form submit should have correct placeholder" <|
                 \() ->
                     loginComponent
                         |> Query.find [ tag "input" ]
-                        |> Query.has [ attribute "placeholder" "Your username" ]
+                        |> Query.has [ attribute "placeholder" defaultModel.inputPlaceholder ]
+            , test "Form submit should have correct submit label" <|
+                \() ->
+                    loginComponent
+                        |> Query.find [ tag "button" ]
+                        |> Query.has [ text defaultModel.submitLabel]
             ]