Skip to content

Commit 52b7a35

Browse files
committed
Add example to readme
1 parent 3ef4448 commit 52b7a35

File tree

3 files changed

+283
-55
lines changed

3 files changed

+283
-55
lines changed

README.md

Lines changed: 137 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,17 @@
11
# redux-actions-assertions
2-
Assertions for redux actions testing
2+
Assertions for redux actions testing.
33

4-
This library add assertions for [redux actions](http://redux.js.org/docs/advanced/AsyncActions.html) testing.
4+
This library adds assertions for [redux actions](http://redux.js.org/docs/advanced/AsyncActions.html) testing.
55
It use [redux-mock-store](https://github.com/arnaudbenard/redux-mock-store) to mock redux store.
66

77
[![build status](https://img.shields.io/travis/dmitry-zaets/redux-actions-assertions/master.svg?style=flat-square)](https://travis-ci.org/dmitry-zaets/redux-actions-assertions)
88
[![npm version](https://img.shields.io/npm/v/redux-actions-assertions.svg?style=flat-square)](https://www.npmjs.com/package/redux-actions-assertions)
99

10+
## What it does:
11+
- [Simplifies initial setup](#simplifies-initial-setup);
12+
- [Reduces repetitive code of test methods](#reduces-repetitive-code-of-test-methods);
13+
- [Allows to avoid re-testing nested action creators](#allows-to-avoid-re-testing-nested-action-creators);
14+
1015
## Supported Assertion Frameworks/Libraries:
1116
- [chai](#chai)
1217
- [expect](#expect)
@@ -15,13 +20,118 @@ It use [redux-mock-store](https://github.com/arnaudbenard/redux-mock-store) to m
1520

1621
If you have not found assertion framework/library that you are using - you can use [pure javascript assertion](#javascript) or create an issue.
1722

23+
### Simplifies initial setup
24+
It provides singe-time global configuration for middlewares and initial store state.
25+
26+
Without:
27+
```javascript
28+
const middlewares = [thunk];
29+
const mockStore = configureStore(middlewares);
30+
const store = mockStore({ /*initial store object*});
31+
```
32+
With:
33+
```javascript
34+
registerMiddlewares([ thunk ]);
35+
// to set custom initial state
36+
registerInitialStoreState(/*object of function*/);
37+
// to generate initial state of your application
38+
registerInitialStoreState(buildInitialStoreState(/*your root reducer*/));
39+
```
40+
41+
### Reduces repetitive code of test methods
42+
It reduces boilerplate of test methods and makes testing fluent.
43+
44+
Without:
45+
```javascript
46+
const store = mockStore(/* initial state */);
47+
const expectedActions = [
48+
{ type: types.FETCH_TODOS_REQUEST },
49+
/* All expected triggered action objects */
50+
];
51+
store.dispatch(fetchData()).then(() => {
52+
const actions = store.getActions();
53+
expect(actions).toEqual(expectedActions);
54+
}).then(done).catch(done);
55+
```
56+
57+
With:
58+
```javascript
59+
const expectedActions = [
60+
/*All expected triggered action objects or action creator functions*/
61+
];
62+
expect(fetchData()).toDispatchActions(expectedActions, done);
63+
```
64+
65+
With using customised store state:
66+
```javascript
67+
expect(fetchData()).withState({/*custom state*/}).toDispatchActions(expectedActions, done);
68+
```
69+
70+
### Allows to avoid re-testing nested action creators
71+
It allows to test only actions that needs to be tested.
72+
73+
**Example:**
74+
We have two actions (A, B). Each one makes async http requests.
75+
Action A makes request and if result is successful it triggers Action B.
76+
Action B is also used as independent action.
77+
Action B can be tested separately.
78+
We don't need to test it again in Action A.
79+
80+
Actions:
81+
```javascript
82+
function actionA() {
83+
return dispatch => {
84+
dispatch(actionAStart());
85+
return api.getA().then(response => {
86+
dispatch(actionAFinish(response));
87+
dispatch(actionB());
88+
}).catch(err => {
89+
dispatch(actionAFailure(err));
90+
});
91+
};
92+
}
93+
94+
function actionB() {
95+
return dispatch => {
96+
dispatch(actionBStart());
97+
return api.getB().then(response => {
98+
dispatch(actionBFinish(response));
99+
}).catch(err => {
100+
dispatch(actionBFailure(err));
101+
});
102+
};
103+
}
104+
```
105+
106+
Without:
107+
```javascript
108+
const expectedActions = [
109+
{ type: action_a_start },
110+
{ type: action_a_success },
111+
{ type: action_b_start }, // retesting of action B
112+
{ type: action_b_success } // retesting of action B];
113+
const store = mockStore({ todos: [] });
114+
store.dispatch(actionA()).then(() => {
115+
expect(store.getActions()).toEqual(expectedActions);
116+
}).then(done).catch(done);
117+
```
118+
119+
With:
120+
```javascript
121+
expect(actionA()).withState({ todos: [] }).toDispatch([
122+
{ type: action_a_start },
123+
{ type: action_a_success },
124+
actionB() // just executing tested action
125+
], done);
126+
```
127+
18128
## Installation
19129
20130
Using [npm](https://www.npmjs.org/):
21131
22132
$ npm install --save redux-actions-assertions
23133
24-
## Register redux middlewares
134+
### Redux middlewares registration
25135
26136
```js
27137
// using ES6 modules
@@ -36,7 +146,7 @@ registerMiddlewares([
36146
]);
37147
```
38148
39-
## Register default initial store state
149+
### Default initial store state registration
40150
41151
**By using state object or function:**
42152
```js
@@ -88,7 +198,7 @@ assertions.toDispatchActionsWithState(/**/);
88198
Asserts that when given `action` is dispatched it will dispatch `expectedActions`. `action` can be plain object (action) or function (action creator). `expectedActions` can be can be plain object (action) or function (action creator) or array of objects/functions.
89199
90200
```js
91-
toDispatchActions(testActionCreator(), [{type: 'MY_ACTION_START'}], callback);
201+
toDispatchActions(testActionCreator(), [{ type: 'MY_ACTION_START' }], callback);
92202
```
93203
94204
#### toDispatchActionsWithState
@@ -98,7 +208,7 @@ toDispatchActions(testActionCreator(), [{type: 'MY_ACTION_START'}], callback);
98208
Same as `toDispatchActions` + asserts that store initialised with `state` before `action` is dispatched.
99209
100210
```js
101-
toDispatchActions({property: 'value'}, testActionCreator(), [{type: 'MY_ACTION_START'}], callback);
211+
toDispatchActions({property: 'value'}, testActionCreator(), [{ type: 'MY_ACTION_START' }], callback);
102212
```
103213
104214
## [chai](https://github.com/chaijs/chai)
@@ -128,14 +238,14 @@ Asserts that when given `action` is dispatched it will dispatch `expectedActions
128238
129239
```js
130240
expect(myActionCreator())
131-
.to.dispatch.actions({type: 'MY_ACTION_START'}, callback);
241+
.to.dispatch.actions({ type: 'MY_ACTION_START' }, callback);
132242

133243
myActionCreator()
134-
.should.dispatch.actions({type: 'MY_ACTION_START'}, callback);
244+
.should.dispatch.actions({ type: 'MY_ACTION_START' }, callback);
135245

136246
assert.isDispatching(
137247
myActionCreator(),
138-
{type: 'MY_ACTION_START'},
248+
{ type: 'MY_ACTION_START' },
139249
callback
140250
);
141251
```
@@ -152,15 +262,15 @@ Asserts that store initialised with `state` before `action` is dispatched.
152262
```js
153263
expect(myActionCreator())
154264
.with.state({ property: 'value' })
155-
.to.dispatch.actions([{type: 'MY_ACTION_START'}, finishActionCreator()], callback);
265+
.to.dispatch.actions([{ type: 'MY_ACTION_START' }, finishActionCreator()], callback);
156266

157267
myActionCreator()
158268
.should.with.({ property: 'value' })
159-
.dispatch.actions([{type: 'MY_ACTION_START'}, finishActionCreator()], callback);
269+
.dispatch.actions([{ type: 'MY_ACTION_START' }, finishActionCreator()], callback);
160270

161271
assert.isDispatchingWithState(
162272
myActionCreator(),
163-
[{type: 'MY_ACTION_START'}, finishActionCreator()],
273+
[{ type: 'MY_ACTION_START' }, finishActionCreator()],
164274
{ property: 'value' }
165275
callback
166276
);
@@ -190,7 +300,7 @@ Asserts that when given `action` is dispatched it will dispatch `expectedActions
190300
191301
```js
192302
expect(myActionCreator())
193-
.toDispatchActions({type: 'MY_ACTION_START'}, callback);
303+
.toDispatchActions({ type: 'MY_ACTION_START' }, callback);
194304
```
195305
196306
#### .withState
@@ -202,7 +312,7 @@ Asserts that store initialised with `state` before `action` is dispatched.
202312
```js
203313
expect(myActionCreator())
204314
.withState({property: 'value'})
205-
.toDispatchActions([{type: 'MY_ACTION_START'}, finishActionCreator()], callback);
315+
.toDispatchActions([{ type: 'MY_ACTION_START' }, finishActionCreator()], callback);
206316
```
207317
208318
## [expect.js](https://github.com/Automattic/expect.js)
@@ -230,7 +340,7 @@ Asserts that when given `action` is dispatched it will dispatch `expectedActions
230340
231341
```js
232342
expect(myActionCreator())
233-
.to.dispatchActions({type: 'MY_ACTION_START'}, callback);
343+
.to.dispatchActions({ type: 'MY_ACTION_START' }, callback);
234344
```
235345
236346
#### .withState
@@ -241,8 +351,8 @@ Asserts that store initialised with `state` before `action` is dispatched.
241351
242352
```js
243353
expect(myActionCreator())
244-
.withState({property: 'value'})
245-
.to.dispatchActions([{type: 'MY_ACTION_START'}, finishActionCreator()], callback);
354+
.withState({ property: 'value' })
355+
.to.dispatchActions([{ type: 'MY_ACTION_START' }, finishActionCreator()], callback);
246356
```
247357
248358
## [should](https://github.com/shouldjs/should.js)
@@ -271,10 +381,10 @@ Asserts that when given `action` is dispatched it will dispatch `expectedActions
271381
272382
```js
273383
should(myActionCreator())
274-
.dispatchActions({type: 'MY_ACTION_START'}, callback);
384+
.dispatchActions({ type: 'MY_ACTION_START' }, callback);
275385

276386
myActionCreator().should
277-
.dispatchActions({type: 'MY_ACTION_START'}, callback);
387+
.dispatchActions({ type: 'MY_ACTION_START' }, callback);
278388
```
279389
280390
#### .withState or with.state
@@ -289,18 +399,18 @@ Asserts that store initialised with `state` before `action` is dispatched.
289399
290400
```js
291401
should(myActionCreator())
292-
.withState({property: 'value'})
293-
.dispatchActions({type: 'MY_ACTION_START'}, callback);
402+
.withState({ property: 'value' })
403+
.dispatchActions({ type: 'MY_ACTION_START' }, callback);
294404

295405
should(myActionCreator())
296-
.with.state({property: 'value'})
297-
.dispatchActions({type: 'MY_ACTION_START'}, callback);
406+
.with.state({ property: 'value' })
407+
.dispatchActions({ type: 'MY_ACTION_START' }, callback);
298408

299409
myActionCreator().should
300-
.withState({property: 'value'})
301-
.dispatchActions({type: 'MY_ACTION_START'}, callback);
410+
.withState({ property: 'value' })
411+
.dispatchActions({ type: 'MY_ACTION_START' }, callback);
302412

303413
myActionCreator().should
304-
.with.state({property: 'value'})
305-
.dispatchActions({type: 'MY_ACTION_START'}, callback);
414+
.with.state({ property: 'value' })
415+
.dispatchActions({ type: 'MY_ACTION_START' }, callback);
306416
```

0 commit comments

Comments
 (0)