Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/akameco/reducer-tester

Utilities for testing redux reducers
https://github.com/akameco/reducer-tester

diff jest react reducer redux snapshot snapshot-testing test

Last synced: 3 months ago
JSON representation

Utilities for testing redux reducers

Host: GitHub
URL: https://github.com/akameco/reducer-tester
Owner: akameco
License: mit
Created: 2018-03-24T12:39:36.000Z (over 6 years ago)
Default Branch: master
Last Pushed: 2020-02-09T16:05:54.000Z (over 4 years ago)
Last Synced: 2024-07-09T10:19:10.492Z (4 months ago)
Topics: diff, jest, react, reducer, redux, snapshot, snapshot-testing, test
Language: TypeScript
Homepage:
Size: 878 KB
Stars: 19
Watchers: 3
Forks: 3
Open Issues: 0
Metadata Files:
- Readme: readme.md
- License: license

Awesome Lists containing this project

awesome-list - reducer-tester

README

        # reducer-tester

[![Build Status](https://travis-ci.org/akameco/reducer-tester.svg?branch=master)](https://travis-ci.org/akameco/reducer-tester)

[![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest)

[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

[![All Contributors](https://img.shields.io/badge/all_contributors-3-orange.svg?style=flat-square)](#contributors)

> reducer tester

See [how-to-test-reducers](https://github.com/akameco/how-to-test-reducers)

## Install

```

$ yarn add --dev reducer-tester

```

## Usage

```js

// reducer.js

export const initialState = { count: 0, other: 'other' }

export default (state = initialState, action) => {

  switch (action.type) {

    case 'inc':

      return { ...state, count: state.count + 1 }

    case 'dec':

      return { ...state, count: state.count - 1 }

    default:

      return state

  }

}

// reducer.test.js

import reducerTester from 'reducer-tester'

import reducer, { initialState } from './reducer'

reducerTester({

  reducer,

  state: initialState,

  tests: [{ type: 'inc' }, { type: 'dec' }],

})

```

### Snapshot

```diff

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`handle initial state 1`] = `

"Snapshot Diff:

Compared values have no visual difference."

`;

exports[`dec 1`] = `

"Snapshot Diff:

- Before

+ After

  Object {

-   "count": 0,

+   "count": -1,

    "other": "other",

  }"

`;

exports[`inc 1`] = `

"Snapshot Diff:

- Before

+ After

  Object {

-   "count": 0,

+   "count": 1,

    "other": "other",

  }

`;

```

## Full example

```js

import reducerTester from 'reducer-tester'

import reducer, { initialState } from './reducer'

reducerTester({

  reducer, // #required

  state: initialState, // #required

  tests: [{ type: 'inc' }, { type: 'dec' }], // #required

  initialTest: false, // # optional, default: true

  titlePrefix: 'handle ', // # optional, default: ''

})

```

```diff

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`handle dec 1`] = `

"Snapshot Diff:

- Before

+ After

  Object {

-   "count: 0,

+   count: -1,

  }

`;

exports[`handle inc 1`] = `

"Snapshot Diff:

- Before

+ After

  Object {

-   count: 0,

+   count: 1,

  }

`;

```

### Tips

#### Atom Editor User

Install `language-diff` and `file-types`. And open `config.json` and edit as blow.

```cson

"*":

  "file-types":

    "\\.js\\.snap$": "source.diff"

```

Hooray! Very readable!

![68747470733a2f2f71696974612d696d6167652d73746f72652e73332e616d617a6f6e6177732e636f6d2f302f31353331392f64666537363137312d323735322d646265302d613038652d6330633436646330396264662e706e67 (495×575)](https://camo.qiitausercontent.com/d621872e2fedd535ccdb694170499d2ee7031080/68747470733a2f2f71696974612d696d6167652d73746f72652e73332e616d617a6f6e6177732e636f6d2f302f31353331392f64666537363137312d323735322d646265302d613038652d6330633436646330396264662e706e67)

## Contributors

Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):


_akameco
💻 📖 ⚠️ 🚇
_{Ahn Dohyung}
📖
_kinakobo
📖

This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind welcome!

## License

MIT © [akameco](http://akameco.github.io)