React.addons.TestUtils.Simulate.scroll не работает

Я пытаюсь смоделировать событие прокрутки с ReactJS и JSDOM.

Сначала я попробовал следующее:

var footer = TestUtils.findRenderedDOMComponentWithClass(Component, 'footer');
footer.scrollTop = 500;
TestUtils.Simulate.scroll(footer.getDOMNode());
//I tried this as well, but no luck
//TestUtils.Simulate.scroll(footer);

Событие прокрутки не распространяется вообще. Затем я вручную создал событие, и все работало нормально:

var evt = document.createEvent("HTMLEvents");
evt.initEvent("scroll", false, true);
element.dispatchEvent(evt);

Вопрос: я делаю что-то не так с TestUtils? Как я могу заставить это работать?

Алан

2 ответа

Моя ситуация может отличаться от ОП, но я боролся с подобной проблемой и нашел свой путь здесь после множества поисков. Я понял суть моей проблемы в том, что TestUtils.Simulate.scroll() имитирует только событие прокрутки, отправляемое конкретным компонентом React (например, когда overflow: scroll для этого компонента), а не событие прокрутки, отправляемое window,

В частности, я пытался протестировать обработчик прокрутки, который я настроил в классе React, вот так:

componentDidMount: function () {
    window.addEventListener('scroll', this.onScroll);
},

componentWillUnmount: function () {
    window.removeEventListener('scroll', this.onScroll);
},

Тестировать onScroll()Я наконец-то понял, что мне нужно смоделировать отправку события прокрутки из window, как это:

document.body.scrollTop = 100;
window.dispatchEvent(new window.UIEvent('scroll', { detail: 0 }));

Это отлично сработало для меня.

Судя по этому и этому, я считаю, что TestUtils имитирует прокрутку с помощью WheelEvent, что означает, что ему нужно deltaY параметр, чтобы знать, как далеко прокручивать. Это будет выглядеть так:

TestUtils.Simulate.scroll(footer.getDOMNode(), { deltaY: 500 });
Другие вопросы по тегам