如何使用fireEvent.scroll -testing-library对容器内的元素进行反应？

Question

我试图模拟包含在div中的元素中的滚动，这是传递给render函数的元素。

我正在尝试这样的东西，但似乎当我的下一个expect正在下降时，div没有滚动。

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);

这是触发scroll事件的正确方式吗？还有别的选择吗？

Answer 1

你有没有试过将EventListener添加到滚动容器中？我只是不确定您可能刚刚使用的那个库，但我非常确定，在正常情况下，在没有侦听器的情况下调用scroll fireEvent不会执行任何事情。在您的fireEvent之前，插入如下内容：

scrollContainer.addEventListener('scroll', () => { /* some callback */ });

并将您的fireEvent更改为：

fireEvent.scroll(scrollContainer, { target: { scrollY: 100 } });