Skip to content

Instantly share code, notes, and snippets.

Last active February 15, 2023 09:50
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
What would you like to do?
Testing complex redux dispatch
const ActionCard = ({id, dataTestId, icon, label, onClick, dispatch}) => {
const onActionCardClick = () => {
dispatch((dispatch, getState) => onClick(dispatch, getState()));
return (
<div id={id} data-test-id={dataTestId} className='action-card' onClick={onActionCardClick}>
<Icon type={icon}/>
<Truncate wrapper={(<Highlighter/>)}>{i18next.t(label)}</Truncate>
ActionCard.propTypes = propTypes;
ActionCard.defaultProps = defaultProps;
export default connect()(ActionCard);
import React from 'react';
import {shallow} from 'enzyme';
import {expect} from 'chai';
import sinon from 'sinon';
import Icon from 'components/general/Icon';
import Truncate from 'components/general/Truncate';
import Highlighter from 'components/general/Highlighter';
import ActionCard from './ActionCard';
describe('<ActionCard/>', () => {
const props = {
type: 'success',
icon: 'check-circle',
label: 'actioncardupdate_success',
onClick: sinon.spy(),
dispatch: sinon.spy(),
const wrapper = shallow(<ActionCard.WrappedComponent {...props}/>);
describe.only('Events', () => {
it('should call the onClick function prop when clicked', () => {
const getStateSpy = sinon.stub().returns('getState');
// retrieve the function passed to `dispatch`
const [dispatchFn] = props.dispatch.firstCall.args;
// call the function passed to `dispatch` with the Sinon spies
dispatchFn(props.dispatch, getStateSpy);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment