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? Как я могу заставить это работать?

Алан


reactjs javascript jsdom javascript-events reactjs-testutils
person Alan Souza    schedule 08.05.2015    source источник

Ответы (2)


arrow_upward
10
arrow_downward

Моя ситуация может отличаться от ситуации ОП, но я боролся с аналогичной проблемой и нашел свой путь сюда после долгих поисков. Я понял, что суть моей проблемы заключалась в том, что 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 }));

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

person robwhess    schedule 24.01.2016

arrow_upward
3
arrow_downward

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

TestUtils.Simulate.scroll(footer.getDOMNode(), { deltaY: 500 });
person Jakemmarsh    schedule 08.05.2015
comment
На самом деле это была ложная тревога. Это не работает. Событие не получило распространения. - person Alan Souza; 09.05.2015