Я действительно не знаю, как смоделировать встроенную функцию в дочернем компоненте реагировать
Мой стек: sinon
, chai
, enzyme
;
Использование компонента:
<ListItem onClick={() => someFn()} />
Компонент рендеринга:
render() {
return (
<li>
<a href="#" onClick={e => {
e.preventDefault();
this.props.onClick();
}}
> whatever </a>
</li>
);
}
Здесь у нас есть функция onClick
, которая вызывает e.preventDefault()
. Как сказать <a href>
(link
) не звонить e.preventDefault()
? Как я могу издеваться над onClick
?
Вот что я попробовал в тестах:
Настройка мелкой копии
function setup() {
const someFn = sinon.stub();
const component = shallow(
<ListItem
onClick={() => {
someFn();
}}
/>
);
return {
component: component,
actions: someFn,
link: component.find('a'),
listItem: component.find('li'),
}
}
И тест
it('simulates click events', () => {
const { link, actions } = setup();
link.simulate('click'); //Click on <a href>
expect(actions).to.have.property('callCount', 1); //would be good if we'll remove e.preventDefault()
});
Ошибка вывода теста:
TypeError: Cannot read property 'preventDefault' of undefined