If you want to test your components you can use the automatic tests or you create a private
main method in your component and open the page in elm reactor
.
These methods helps you to create small component tests that you can test with elm reactor
without
writing a large boilerplate.
{ model : model
, events : List event
, key : Maybe Browser.Navigation.Key
}
The internal model alias that is used by element
, application
and applicationNoUrl
.
Platform.Program () (DebugComponent model event) msg
The test program type for component tests. This is an alias for Platform.Program
but with an
internal model and no flags.
element : { init : ( model, Platform.Cmd.Cmd msg ), view : model -> Html msg, viewEvents : Maybe (List event -> Html Basics.Never), update : msg -> model -> Triple model (Platform.Cmd.Cmd msg) (List event), subscriptions : model -> Platform.Sub.Sub msg } -> Program model msg event
Creates a small test program that you can use to test your components. This is similar to
Browser.element
.
If you set a rendering function to viewEvents
all events from the update
method are recorded and
shown in your HTML model. If the rendering function for viewEvents
is Nothing
all returned
events are discarded and ignored.
-- don't need to be exposed. It is automaticly used by elm if you make this file directly or
-- open it in elm reactor.
main : Component.Test.Program MyComp MyCompMsg MyCompEvent
main =
Component.Test.element
{ init = init
, view = view
, viewEvents = Nothing
, update = update
, subscriptions = subscriptions
}
application : { init : Url -> Browser.Navigation.Key -> ( model, Platform.Cmd.Cmd msg ), view : model -> Html msg, viewEvents : Maybe (List event -> Html Basics.Never), update : Browser.Navigation.Key -> msg -> model -> Triple model (Platform.Cmd.Cmd msg) (List event), subscriptions : model -> Platform.Sub.Sub msg, onUrlRequest : Browser.UrlRequest -> msg, onUrlChange : Url -> msg } -> Program model msg event
Creates a small test program that you can use to test your components. This is similar to
Browser.application
.
This allows you to respond to url changes and navigate. You don't need to store the Key
because it
is automaticly provided in the update method for you.
If you set a rendering function to viewEvents
all events from the update
method are recorded and
shown in your HTML model. If the rendering function for viewEvents
is Nothing
all returned
events are discarded and ignored.
-- don't need to be exposed. It is automaticly used by elm if you make this file directly or
-- open it in elm reactor.
main : Component.Test.Program MyComp MyCompMsg MyCompEvent
main =
Component.Test.application
{ init = init
, view = view
, viewEvents = Nothing
, update = update
, subscriptions = subscriptions
, onUrlRequest = onUrlRequest
, onUrlChange = onUrlChange
}
applicationNoUrl : { init : ( model, Platform.Cmd.Cmd msg ), view : model -> Html msg, viewEvents : Maybe (List event -> Html Basics.Never), update : Browser.Navigation.Key -> msg -> model -> Triple model (Platform.Cmd.Cmd msg) (List event), subscriptions : model -> Platform.Sub.Sub msg, noop : msg } -> Program model msg event
Creates a small test program that you can use to test your components. This is similar to
Browser.application
.
This allows you to navigate the page. You don't need to store the Key
because it
is automaticly provided in the update method for you. You are not able to respond to url changes.
If you set a rendering function to viewEvents
all events from the update
method are recorded and
shown in your HTML model. If the rendering function for viewEvents
is Nothing
all returned
events are discarded and ignored.
-- don't need to be exposed. It is automaticly used by elm if you make this file directly or
-- open it in elm reactor.
main : Component.Test.Program MyComp MyCompMsg MyCompEvent
main =
Component.Test.application
{ init = init
, view = view
, viewEvents = Nothing
, update = update
, subscriptions = subscriptions
, noop = Noop
}