.simulate(event[, mock]) => Self

Эмулирует события на узле-обёртке. Обёртка должна содержать один узел.

Аргументы

1. event (String): Имя эмулируемого события
2. mock (Object [необязательно]): Объект-модель события, который будет объединён с объектом события, переданным обработчикам.

Возвращаемое значение

ReactWrapper: Возвращает себя.

Пример class component

class Foo extends React.Component {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
  }

  render() {
    const { count } = this.state;
    return (
      <div>
        <div className={`clicks-${count}`}>
          {count} clicks
        </div>
        <a href="url" onClick={() => { this.setState({ count: count + 1 }); }}>
          Increment
        </a>
      </div>
    );
  }
}

const wrapper = mount(<Foo />);

expect(wrapper.find('.clicks-0').length).to.equal(1);
wrapper.find('a').simulate('click');
expect(wrapper.find('.clicks-1').length).to.equal(1);

Пример functional component

const Foo = ({ width, height, onChange }) => (
  <div>
    <input name="width" value={width} onChange={onChange} />
    <input name="height" value={height} onChange={onChange} />
  </div>
);
Foo.propTypes = {
  width: PropTypes.number.isRequired,
  height: PropTypes.number.isRequired,
  onChange: PropTypes.func.isRequired,
};

const testState = { width: 10, height: 20 };
const wrapper = mount((
  <Foo
    width={testState.width}
    height={testState.height}
    onChange={(e) => {
      testState[e.target.name] = e.target.value;
    }}
  />
));

expect(wrapper.find('input').at(0).prop('value')).toEqual(10);
expect(wrapper.find('input').at(1).prop('value')).toEqual(20);
wrapper.find('input').at(0).simulate('change', { target: { name: 'width', value: 50 } });
wrapper.find('input').at(1).simulate('change', { target: { name: 'height', value: 70 } });
expect(testState.width).toEqual(50);
expect(testState.height).toEqual(70);

Общие сложности

• Как указано в сигнатуре функции, передача объекта-модели события необязательна. Стоит отметить, что ReactWrapper передаст объект SyntheticEvent обработчику события в вашем коде. Имейте в виду, что если тестируемый код использует свойства, которые не включены в SyntheticEvent, например event.target.value, вам потребуется предоставить объект-модель события, как показано ниже .simulate("change", { target: { value: "foo" }}) для его корректной работы.