tape-redux

Super simple testing for Redux apps.

Usage no npm install needed!

<script type="module">
  import tapeRedux from 'https://cdn.skypack.dev/tape-redux';
</script>

README

tape-redux

Write tape tests for redux blazingly fast.

npm install --save-dev tape-redux
test('app reducer openMenu', reducerTest(
    app,                              // Reducer
    {menuOpen: false},                // Initial state
    actions.openMenu,                 // Action
    {menuOpen: true},                 // Final state
    'openMenu should change the menuOpen property to true'   // Description
))

Why tape instead of mocha?

Boom.

Motivation

Dan Abramov's amazing egghead tutorial on Redux showed us how to write tests for redux.

But writing those tests over and over can get cumbersome.

Here's a standard reducer test in tape for opening the app menu:

import test from 'tape'
import deepFreeze from 'deep-freeze'

import app from '../../src/reducers/app'
import * as actions from '../../src/actions/app'

test('app reducer openMenu', (t) => {
    const stateBefore = {
        menuOpen: false
    }
    const stateAfter = {
        menuOpen: true
    }

    deepFreeze(stateBefore)
    deepFreeze(stateAfter)

    t.deepEqual(
        app(stateBefore, actions.openMenu()),
        stateAfter,
        'openMenu should change the menuOpen property to true'
    )

    t.end()
}

And here's that same test in tape-redux:

import test from 'tape'
import {reducerTest} from 'tape-redux'

import app from '../../src/reducers/app'
import * as actions from '../../src/actions/app'

test('app reducer openMenu', reducerTest(
    app,
    {menuOpen: false},
    actions.openMenu,
    {menuOpen: true},
    'openMenu should change the menuOpen property to true'
))

Compounded over time, the time/typing savings are incredible.

Here's an action test in plain-old tape:

import test from 'tape-catch'

import * as types from '../../src/constants/ActionTypes'
import * as actions from '../../src/actions/app'

test('app action openMenu', (t) => {
    t.deepEqual(
        actions.openMenu,
        {type: types.OPEN_MENU},
        'openMenu should have OPEN_MENU as type'
    )
    t.end()
})

and here's that same action test in tape-redux:

import test from 'tape-catch'
import {actionTest} from 'tape-redux'

import * as types from '../../src/constants/ActionTypes'
import * as actions from '../../src/actions/app'

test('app action openMenu', actionTest(
    actions.openMenu,
    {type: types.OPEN_MENU},
    'openMenu should have OPEN_MENU as type'
))

Granted, the savings for actionTest aren't as profound, but over many tests, it makes writing and reading tests much faster.

Composition

Reducer tests:

test('REDUCER_NAME reducer ACTION_NAME', reducerTest(
    reducer,
    stateBefore,
    action,
    stateAfter[,
    'description']
))

*Note the name for the test is just a convention.

Action tests:

test('GROUP_NAME action ACTION_NAME', actionTest(
    actionCreator,
    action[,
    'description']
))

if you have an action creator that accepts an argument, use .bind:

test('GROUP_NAME action ACTION_NAME', actionTest(
    actionCreator.bind(null, argument),
    action[,
    'description']
))

Thanks!! :)

License

MIT