柏树-等待元素改变状态

Question

我使用Cypress进行了一些UI测试，其中有一个span元素(#done-status)最初具有"值"，然后是"In Progress"，然后是"Complete"。在它变为'Complete'之后，我想断言另一个元素(#failures)的值为0。状态从空字符串变为In Progress和Complete需要一些时间，这取决于某些执行。我怎么能等到它改变状态呢。我尝试随机等待，但由于元素已经在DOM上，它不等待超时，它失败了。像这样:

it('should verify if the tests passed', () => {
cy.get('#done-status')
.should('have.value', '');
cy.get('#done-status', { timeout: 10000 })
.should('have.value', 'In Progress')
cy.get('#done-status', { timeout: 300000 })
.should('have.value', 'Complete');
cy.get('.failures')
.should('have.value', 0);
});

是否有一种方法可以让它等到状态改变，并在最后验证失败的数量。

感谢

Answer 1

你可以使用cypress-wait-until插件。

1。安装:

npm i -D cypress-wait-until

2。安装完成后，转到cypress/support/commands.js并写入:

import 'cypress-wait-until';

3。在你的测试中写:

cy.waitUntil(() =>
cy.get('#done-status').then($ele =>
$ele[0].value == 'Complete',
//timeouts
{
timeout: 20000, // waits up to 2000 ms
interval: 500 // performs the check every 500 ms
}
)
)
cy.get('.failures').should('have.value', 0);