赛普拉斯重新加载页面,直到可见元素

时间:2020-05-27 19:47:31

标签: cypress

我有以下情况:

用户上传文件后,屏幕上将显示一个表格报告。问题是:该表不会自动出现,用户需要重新加载页面,如果文件已被处理,则该表会显示在屏幕上,如果仍在处理中,则用户需要稍等片刻并重新加载。

如何在不使用cy.wait()等待任意时间的情况下完成此任务。我想到了类似的东西:

    cy.reload().should(() => {
        expect(document.querySelectorAll('table')).to.not.be.empty
    })

但是没用

1 个答案:

答案 0 :(得分:0)

如果should()声明失败,则仅赛普拉斯repeats certain commands。如您所见,reload()不是其中之一。

我建议使用递归来实现重复的重载周期。这是一个示例:

let remainingAttempts = 30;

function waitUntilTableExists() {
    let $table = Cypress.$('table');
    if ($table.length) {
        // At least one table tag was found.
        // Return a jQuery object.
        return $table;
    }

    if (--remainingAttempts) {
        cy.log('Table not found yet. Remaining attempts: ' + remainingAttempts);

        // Requesting the page to reload (F5)
        cy.reload();

        // Wait a second for the server to respond and the DOM to be present.
        return cy.wait(1000).then(() => {
            return waitUntilTableExists();
        });
    }
    throw Error('Table was not found.');
}

waitUntilTableExists().then($table => {
    cy.log('table: ' + $table.text());
});

您可能很想使用forwhile循环,但这不适用于赛普拉斯。这是因为大多数命令不会立即执行。而是commands are asynchronous