加载柏树时继续向下滚动

Question

我有一个页面有一个元素，如果您向下滚动，它会加载新数据。

这大约需要 10 秒。

我写了下面的测试：

it('Should display at least one facility in booking panel', (done) => {
  function recursivelyScroll() {
    cy.get(element)
      .scrollTo('bottom');

    cy.get(element)
      .then($el => {
        // If the element contains a loading class, we wait one second and scroll down again
        if ($el.find(Loading).length > 0) {
          setTimeout(recursivelyScroll, 1000);
        } else {
          // We are done waiting, no more loading is needed
          // write test here

          done();
        }
      });
  }
  recursivelyScroll();
});

CypressError

Timed out after 4000ms. The done() callback was never invoked!

根据 Cypress 的说法，done() 方法的调用速度不够快，但他们没有关于如何延长 done 时间段的文档。此外，可能有一种我不知道的更好的方法来在赛普拉斯中创建这种滚动行为。有简单的解决方法吗？

Answer 1

您是否尝试过在 cypress 中使用递归插件？

看起来像这样：

cy.get(element).scrollTo('bottom');
recurse(
    () => cy.contains('element', 'Loading').should(() => {}),
    ($quote) => $quote.length > 0 ,
    {
      limit: 300,
      log: false,
      post(){
        setTimeout(recursivelyScroll, 1000);
      }
    },
)

这个想法是在这里采纳的：https://www.youtube.com/watch?v=KHn7647xOz8 这里举例说明如何使用和安装 https://github.com/bahmutov/cypress-recurse

Answer 2

尝试切换到 When 断言并在执行之外声明该函数：

When('Should display at least one facility in booking panel', (done) => {
    recursivelyScroll(done)
}

function recursivelyScroll(done){
    //see implementation below
}

不确定“正在加载”是什么，也许你必须用双引号引起来？

此外请注意cypress是异步的，那么scrollTo和then代码段在你的代码中是同时执行的，在scroll之后使用then即可。

并且我会在执行递归之前将setTimeout更改为cy wait函数，试试下面的代码：

function recursivelyScroll(done) {
    cy.get(element)
    .scrollTo('bottom')
    .then($el => {
        // If the element contains a loading class, we wait one second and scroll down again
        if ($el.find(".Loading").length > 0) {
            cy.wait(1000).then(()=>{
                recursivelyScroll(done);
            })
        } else {
            // We are done waiting, no more loading is needed
            // write test here
            done();
        }
    });
}

加载柏树时继续向下滚动

Keep scrolling down while loading in cypress

javascript

typescript

integration-testing

cypress

e2e-testing