redux-thunk-testing
Test utility and Snapshot testing for complex and nested redux-thunks
About
redux-thunk-testing
is a small utility/wrapper which aims to help in testing complex thunk actions
and their side effects easily. The library runs through the action, executing all the thunks that
are found, and subsequently provides utilities around the results for testing.
Conceptually, this allows you to set all your conditions, before running the action similarly to how it would execute in the context of your application.
Motivation
redux-thunk is a simple middleware for async and side-effects logic, and is nearly as ubiquitous as redux itself.
However, as more complex flows and async actions are added, it becomes harder and more unwieldy to test. Some projects like redux-saga were created to help handle such issues, but there might be situations where using such projects might not be a viable option due to constraints and requirements of the project.
Features
- Supports Snapshot Testing
- Test / Assertion framework agnostic.
ActionTester
- for usage withany assertion library
. (eg: Chai.js)JestActionTester
- for usage withjest.fn()
.
- Supports
thunk.withExtraArgument
- Supports actions that return
thunks
. - Supports
flux standard actions
with a thunk as the payload. see notes - TypeScript support (definition file)
Installation
Install the library via:
npm install redux-thunk-testing --save-dev
Documentation
Quick overview of functions / classes:
class
ActionTesterclass
JestActionTesterfunction
actionArraySnapshotfunction
actionSnapshotfunction
actionTesterSnapshotfunction
actionTracerfunction
actionTypesfunction
createActionRunner
The classes encapsulates the functions within this library.
Please refer to Project Documentation for the full list of available methods.
Examples
About the redux-thunk-readme-example
These are sample tests written for the "make a sandwich" code example from
redux-thunk
README.md. A copy of the example
has been copied over. Please see examples/redux-thunk-readme/action.js.
Small change:
Unlike the original example, fetchSecretSauce()
is assumed to be injected as an extraArgument
to a thunk. This is the only change.
Snippet:
;
Notes
Tests are async
The runner treats all thunks as async
methods / returning promises
, even if you are
returning a basic type (eg: boolean
, string
).
As such, when using the tester, you should always use await
or provide a done
callback.
eg:
// using async-awaitawait tester; // using PromisesPromise // dispatch always returns a promise ; // using a callbacktester;
THUNK_ACTION
type
This action.type
is logged when the action being dispatched is a direct function / thunk and not
a functional payload of a "Flux Standard Action"
// Givenconst action = { // code ...}; // when testingtester; // will resolve to (within the test suite)tester;
Flux Standard Action with Thunk payload
Note: This is optional
If you don't want to see "THUNK_ACTION" in your tests, you might want to consider dispatching FSA with a thunk payload.
i.e.
// Instead of { return { // code };} // Try { return type: 'NAMED_ACTION' { // code } ;}
However, in order to do the above, you will need the following middleware.
const fsaThunk = { if typeof actionpayload === 'function' // Convert to a thunk action return ; return ;}; // Add it to your redux store.; const store = ;
License
redux-thunk-testing
is MIT licensed