离子3无限卷轴在e2e测试中的模拟茉莉花/量角器

在您的示例中,卷轴的实现依赖于卷轴的速度/速度,我猜当 scrollIntoView 被称为。

一种解决方法是通过在合理的时间内发出多个滚动事件来模拟平滑滚动。这个想法是尽可能地再现真实用户的行为。

一些浏览器已经提供了通过 scrollIntoView (由Chrome 62支持):

$0.scrollIntoView({behavior: "smooth", block: "end"});

使用公认的答案,在我的情况下,我使用 ion-infinite-scroll 作为论点。

完成测试,以检查是否在离子中加载了更多内容:

describe('Scroll', () => {
    it('should load more when reached end', async () => {
        let list = getList();

        let currentCount = await list.count();

        const refresher = element(by.tagName('ion-infinite-scroll')).getWebElement();

        let count = 0;

        while(true){
            browser.executeScript(`arguments[0].scrollIntoView({behavior: "smooth", block: "end"});`, refresher);
            browser.sleep(1000); // wait for data to be loaded from api
            list = getList();
            let newCount = await list.count();
            expect(newCount).toBeGreaterThanOrEqual(currentCount)
            expect(newCount).toBeLessThanOrEqual(currentCount * 2)
            if(newCount === currentCount){
                break;
            }
            currentCount = newCount;
            count++;
        }

        expect(count).toBeGreaterThan(0);
    })
});

function getList() {
    return element(by.className(pageId + ' list')).all(by.tagName('ion-item'));
}