https://github.com/khanghoang/react-redux-mock
Mock react-redux for testing
https://github.com/khanghoang/react-redux-mock
mock react redux testing
Last synced: about 1 year ago
JSON representation
Mock react-redux for testing
- Host: GitHub
- URL: https://github.com/khanghoang/react-redux-mock
- Owner: khanghoang
- License: mit
- Created: 2017-03-10T17:26:07.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2018-02-05T19:12:35.000Z (over 8 years ago)
- Last Synced: 2025-03-26T11:21:32.406Z (over 1 year ago)
- Topics: mock, react, redux, testing
- Language: JavaScript
- Homepage:
- Size: 60.5 KB
- Stars: 5
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# redux-react-mock
Mock the `react-redux` package.
### Installation
```
yarn add --dev react-redux-mock
```
```
npm install --save-dev react-redux-mock
```
### Usage
Let's assume that you have an `connected` component with this structure.
```
import React from 'react';
import { connect } from 'react-react';
const Text = ({ content }) =>
{content}
;
const contentSelector = state => state.content;
const ConnectedText = compose(
connect(state => {
content: contentSelector(state),
}),
)(Text);
export default ConnectedText;
```
This is how you can test the component above with `react-redux-mock`?
```
jest.mock('react-redux', () => require('react-redux-mock'));
import { __setState } from 'react-redux';
import { mount } from 'enzyme';
describe('Text component', () => {
it('renders correctly', () => {
__setState({
content: 'foo',
});
const component = mount();
expect(component).toMatchSnapshot();
});
});
```
Notice that you can render the `connected` component itself without
defining what is the store and the `Provider` component.
### Have question?
I'm happy to answer all questions from you at [@khanght](https://twitter.com/khanght).
Happy coding, forks!