Как смоделировать действие в подключенном компоненте React

Question

пытался познакомиться с Джестом, и я немного застрял в следующей проблеме.

У меня есть такой компонент, как follow;

import { populateBrands } from '../../actions/brand/BrandActions';


export class CampaignForm extends Component {

  constructor(props) {
    super(props);

    this.state = {
      name: null,
      type: 'a-type',
      brand: null
    };
  }

  componentWillMount() {
    this.props.populateBrands({
      payload: {
        filter: {
          organisation: null,
          archived: false
        },
        pageNum: 0
      }
    });

    if (this.props.campaign) {
      const {
        name,
        type,
        brand
      } = this.props.campaign;

      this.setState({
        name,
        type,
        brand: brand.id,
      });
    }
  }


  render() {
   // Render the Form
  }
}

function mapStateToProps(state) {
  let brands = Selectors.getAllActiveBrands(state);
  return {
    brands
  };
}

const mapDispatchToProps = {
  populateBrands
};

export default withRouter(
  connect(
    mapStateToProps,
    mapDispatchToProps
)(CampaignForm));

Я хочу проверить что-то в рендере, иногда выпадающий список отключен, иногда нет, в зависимости от марок функция populateBrands возвращается и устанавливает состояние.

Как лучше всего протестировать что-то подобное?

Пока у меня есть это:

it('should display warning', () => {
  const component = shallow(
    <CampaignForm
      processMessage='edit'
      handleSubmit={mockHandleSubmit}
      submitButtonLabel='edit'
      location={'blah'}
      populateBrands={mockPopulateBrands} // mock the function
      brands={fixtureBrands} // pass in the fixture brand data
    />, { context, childContextTypes }
  );

    // do my tests here

});

Это лучший путь? Я чувствую, что было бы лучше, если бы я мог издеваться над функцией populateBrands и возвращать нужные мне значения, а не делать то, что я в данный момент делаю.

Рад слышать, что лучшие практики в этом сценарии