I'm trying to simulate the scrolling in a element contained in a div, which is the one passed to render
function.
I'm trying with something like this, but it seems that the div is not scrolling as my next expect
is falling.
const content = (
<div style={{display: 'flex'}}>
<LazyList itemRenderer={itemRenderer} items={items} minItemHeight={MIN_ITEM_HEIGHT} />
</div>
);
mockOffsetSize(WIDTH, HEIGHT);
const {debug, container, queryByText} = render(content);
const scrollContainer = container.querySelector('.ReactVirtualized__Grid');
debug(scrollContainer);
fireEvent.scroll(scrollContainer, {y: 100});
debug(scrollContainer);
Is this the correct way of firing the scroll event? Any other alternatives?
Simulate a Click Event The onClick should pass through to the component's underlying <button /> element because we're spreading ( {... props} ) that props through to it. In the test, we create a ref so that we can pass it to the rendered Button and later to the Simulate. click call.
Consider fireEvent. click , which creates a click event and dispatches that event on the given DOM node.
Using fireEvent. change() on a select element fires the event handler, but doesn't update state.
Have you tried adding EventListener to your scroll container? I'm just not sure with that library you may have just used, but I'm pretty sure, in normal situations, calling scroll fireEvent without listener won't execute anything. Before your fireEvent
, insert something like this:
scrollContainer.addEventListener('scroll', () => { /* some callback */ });
and change your fireEvent to:
fireEvent.scroll(scrollContainer, { target: { scrollY: 100 } });
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With