nunntom/elm-ui-select/2.0.3

NOTE: the latest version is 4.0.0

Select.Effect

Update the Select by returning Effects instead of Cmds. This module is designed to help testing with elm-program-test, allowing you to simulate the effects produced by the select and simulate input. If you are not doing this kind of testing, you don't need this module.

Type

type alias Effect effect msg =
Effect effect msg

The Effect type

Update Effect

update : (Msg a -> msg) -> Msg a -> Select a -> ( Select a, Effect Never msg )

Update the Select

type MyEffect
    = SelectEffect (Select.Effect Never Msg)


update : Msg -> Model -> ( Model, MyEffect )
update msg model =
    case msg of
        SelectMsg subMsg ->
            Select.Effect.update SelectMsg subMsg model.select
                |> Tuple.mapFirst (\select -> { model | select = select })
                |> Tuple.mapSecond SelectEffect


performEffect : MyEffect -> Cmd Msg
performEffect effect =
    case effect of
        SelectEffect selectEffect ->
            Select.Effect.perform selectEffect
Request effect
-> (Msg a -> msg)
-> Msg a
-> Select a
-> ( Select a, Effect effect msg )

Update with an HTTP request to retrieve matching remote results. Note that in order to avoid an elm/http dependency in this package, you will need to provide the request Effect yourself.

type MyEffect
    = SelectEffect (Select.Effect MyEffect Msg)
    | FetchThings String


update : Msg -> Model -> ( Model, MyEffect )
update msg model =
    case msg of
        SelectMsg subMsg ->
            Select.Effect.updateWithRequest (Select.request fetchThings) SelectMsg subMsg model.select
                |> Tuple.mapFirst (\select -> { model | select = select })
                |> Tuple.mapSecond SelectEffect


performEffect : MyEffect -> Cmd Msg
performEffect effect =
    case effect of
        SelectEffect selectEffect ->
            Select.Effect.performWithRequest performEffect selectEffect


        FetchThings query ->
            fetchThings (Select.gotRequestResponse query >> SelectMsg) query


fetchThings : (Result Http.Error (List thing) -> msg) -> String -> Cmd msg
fetchThings tagger query =
    Http.get
        { url = "https://awesome-thing.api/things?search=" ++ query
        , expect = Http.expectJson tagger (Decode.list thingDecoder)
        }
type alias Request effect =
Request effect

A request that uses your Effect type

request : (String -> effect) -> Request effect

Create a request. Provide a function that takes the input value and returns an Effect (your app's own Effect type) that can be used to perform an HTTP request. Update will use this Effect when the user types in the input subject to a debounce delay and minimum number of characters which can be configured in the Request module.

Perform Effect

perform : Effect Never msg -> Cmd msg

Turn an Effect into a Cmd

performEffect : MyEffect -> Cmd Msg
performEffect effect =
    case effect of
        SelectEffect selectEffect ->
            Select.Effect.perform selectEffect
performWithRequest : (effect -> Cmd msg) -> Effect effect msg -> Cmd msg

Perform the Effect with a request. You need to provide your own perform function to perform the provided request effect.

performEffect : MyEffect -> Cmd Msg
performEffect effect =
    case effect of
        SelectEffect selectEffect ->
            Select.Effect.performWithRequest performEffect selectEffect


        FetchThings query ->
            fetchThings (Select.gotRequestResponse >> SelectMsg) query

Simulating Effects

{ perform : (() -> msg) -> simulatedTask -> simulatedEffect
, batch : List simulatedEffect -> simulatedEffect
, sleep : Float -> simulatedTask
}
-> Effect Never msg
-> simulatedEffect

Simulate the select effects. This is designed to work with elm-program-test, but since this package doesn't have it as a dependency, you need to provide some of the functions to help with the simulation.

simulateEffect : MyEffect -> SimulatedEffect Msg
simulateEffect effect =
    case effect of
        SelectEffect selectEffect ->
            Select.Effect.simulate
                Example.SelectMsg
                { perform = SimulatedTask.perform
                , batch = SimulatedCmd.batch
                , sleep = SimulatedProcess.sleep
                }
                selectEffect
{ perform : (() -> msg) -> simulatedTask -> simulatedEffect
, batch : List simulatedEffect -> simulatedEffect
, sleep : Float -> simulatedTask
}
-> (effect -> simulatedEffect)
-> Effect effect msg
-> simulatedEffect

Simulate the select effects with a request. This is designed to work with elm-program-test, but since this package doesn't have it as a dependency, you need to provide some of the functions to help with the simulation.

simulateEffect : MyEffect -> SimulatedEffect Msg
simulateEffect effect =
    case effect of
        SelectEffect selectEffect ->
            Select.Effect.simulateWithRequest
                Example.SelectMsg
                { perform = SimulatedTask.perform
                , batch = SimulatedCmd.batch
                , sleep = SimulatedProcess.sleep
                }
                simulateEffect
                selectEffect


        FetchThings query ->
            SimulateHttp.get
                { url = "https://awesome-thing.api/things?search=" ++ query
                , expect = SimulateHttp.expectJson tagger (Decode.list thingDecoder)
                }

Simulating Input

SimulateInputConfig single selector programTest
-> String
-> String
-> programTest
-> programTest

Simulate clicking an option by the text label of the option. This is designed to help simulate input with elm-program-test. Since this package doesn't have elm-test or elm-program-test as dependencies, you need to provide some of the functions from those packages here.

simulateConfig : Select.Effect.SimulateInputConfig (Single msg) Selector (ProgramTest model msg effect)
simulateConfig =
    { simulateDomEvent = ProgramTest.simulateDomEvent
    , find = Query.find
    , attribute = Selector.attribute
    }


selectTest : Test
selectTest =
    Test.test "Typing United and clicking United Kingdom option selects United Kingdom" <|
        \() ->
            ProgramTest.createElement
                { init = Example.init
                , update = Example.update
                , view = Example.view
                }
                |> ProgramTest.withSimulatedEffects simulateEffect
                |> ProgramTest.start ()
                |> ProgramTest.fillIn "" "Choose a country" "United Kingdom"
                |> Select.Effect.simulateClickOption simulateConfig model.select "United Kingdom"
                |> ProgramTest.expectViewHas [ Selector.text "You chose United Kingdom" ]
type alias SimulateInputConfig single selector programTest =
{ simulateDomEvent :
(single -> single) -> ( String, Value ) -> programTest -> programTest
, find : List selector -> single -> single
, attribute : Attribute Never -> selector
}

Config type alias used by simulateClickOption

Mapping

map : (msg -> msg2) -> Effect effect msg -> Effect effect msg2

Map Effect from one msg type to another

mapEffect : (effect -> effect2) -> Effect effect msg -> Effect effect2 msg

Map Effect from one effect type to another