Skip to content

Commit e9acc2b

Browse files
committed
docs: modify readme
1 parent 21432c5 commit e9acc2b

File tree

1 file changed

+32
-1
lines changed

1 file changed

+32
-1
lines changed

README.md

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ This library brings the elmish pattern to react.
3333
- [Testing the init function](#testing-the-init-function)
3434
- [Testing the update handler](#testing-the-update-handler)
3535
- [Combine update and execCmd](#combine-update-and-execcmd)
36+
- [Testing consecutive updates](#testing-consecutive-updates)
3637
- [Testing subscriptions](#testing-subscriptions)
3738
- [UI Tests](#ui-tests)
3839
- [Redux Dev Tools](#redux-dev-tools)
@@ -525,7 +526,7 @@ const updateMap: UpdateMap<Props, Model, Message> = {
525526
526527
### Testing
527528
528-
If you want to test your component with immutable data structures, you can use the `react-elmish/testing/immutable` module. This module provides the same functions as the normal testing module.
529+
If you want to test your component with immutable data structures, you can use the `react-elmish/testing/immutable` module. This module provides the same functions as the normal [testing](#testing-1) module.
529530
530531
## Setup
531532
@@ -990,6 +991,7 @@ To test your **update** handler you can use some helper functions in `react-elmi
990991
| `initAndExecCmd` | Calls the `init` function with the provided props and executes the returned commands. |
991992
| `getUpdateFn` | Returns an `update` function for your update map object. |
992993
| `getUpdateAndExecCmdFn` | Returns an `update` function for your update map object, which immediately executes the command. |
994+
| `getConsecutiveUpdateFn` | Returns an `update` function for your update map object, which runs all consecutive commands until only the model gets updated or nothing happens. |
993995
| `getCreateUpdateArgs` | Creates a factory function to create a message, a model, and props in a test. |
994996
| `createUpdateArgsFactory` | This is an alternative for `getCreateUpdateArgs`. Creates a factory function to create a message, a model, and props in a test. |
995997
| `execCmd` | Executes the provided command and returns an array of all messages. |
@@ -1085,6 +1087,35 @@ it("returns the correct cmd", async () => {
10851087
...
10861088
```
10871089
1090+
### Testing consecutive updates
1091+
1092+
If you want to test multiple `update` functions which are called in a row, you can use the `getConsecutiveUpdateFn` function. This function returns an `update` function that runs all consecutive commands until only the model gets updated or nothing happens.
1093+
1094+
You may have something like this in your `update` map:
1095+
1096+
"load message -> load function -> loaded message -> filter message -> filter function -> filtered message"
1097+
1098+
Then the `consecutiveUpdateFn` will execute all these commands in a row and return the final model after all commands have been executed.
1099+
1100+
```ts
1101+
import { getConsecutiveUpdateFn, createUpdateArgsFactory } from "react-elmish/testing";
1102+
import { init, Msg } from "./MyComponent";
1103+
1104+
const createUpdateArgs = createUpdateArgsFactory(init, () => ({ /* initial props */ }));
1105+
const consecutiveUpdateFn = getConsecutiveUpdateFn(updateMap);
1106+
1107+
it("updates the model and executes all commands", async () => {
1108+
// arrange
1109+
const args = createUpdateArgs(Msg.load(), { /* optionally override model here */ }, { /* optionally override props here */ }, { /* optionally override options here */ });
1110+
1111+
// act
1112+
const newModel = await consecutiveUpdateFn(...args);
1113+
1114+
// assert
1115+
expect(newModel).toStrictEqual({ /* what you expect in the model */ });
1116+
});
1117+
```
1118+
10881119
### Testing subscriptions
10891120
10901121
It is almost the same as testing the `update` function. You can use the `getCreateModelAndProps` function to create a factory for the model and the props. Then use `execSubscription` to execute the subscriptions:

0 commit comments

Comments
 (0)