Cypress - 等待按钮可点击

Question

我知道它在大多数情况下都有效，但是在我测试的网页上，在以下行

cy.get('button[title="Query"]').click()

赛普拉斯跑者超越了get，但坚持click行动直到暂停。如果我将代码修改为

cy.get('button[title="Query"]').as('query')
cy.wait(500)
cy.get('@query').click()

测试成功。

显然，任意等待是一种不好的做法。自动等待、重试能力——正如赛普拉斯声称的功能一样，应该可以防止上述情况发生，但在我的例子中失败了。

此外，Cypress也没有任何should('be.clickable')断言。我如何指示 Cypress 在单击按钮之前等待按钮可单击，或者如果单击挂起，则间隔一段时间重试，直到成功？

Answer 1

该问题可能是由 cypress 脚本和应用程序代码之间的竞争条件引起的， cy.get在单击时，应用程序页面状态仍处于转换状态，因此按钮可见并启用，但预期的事件侦听器尚未执行尚未附加到按钮。如果以下代码也有效，则更有可能

cy.wait(500).get('button[title="Query"]').click()

比等待任意长度更好的替代方法是为其他 DOM 元素添加断言，以确保按钮处于可点击状态。就我而言，该按钮位于选项卡中。我在单击按钮之前单击了选项卡。因此，请确保选择选项卡并且首先渲染选项卡中的元素

cy.get('li[aria-label="Service Selected"]')
cy.get('table.xxx thead tr :nth-child(3)').should('include.text', 'foo')
cy.get('button[title="Query"]').click()