赛普拉斯：有条件地测试UI元素的存在的最佳做法

Question

我正在尝试使用赛普拉斯进行自动测试。但是显然学习新概念和新语言是一项挑战。因此，我不确定是否找到了根据条件简单测试UI元素是否存在的最佳解决方案。
所有元素都呈现在服务器端。

所以基本上有一个DIV元素可以包含其中一个

• “卡”类的DIV元素

OR

• “无操作”类的P元素

为了有条件地对此进行测试，我找出了以下代码：

cy.get('div#section_paused_op').then(($div) => {
    if($div.find('div.card').length > 0) {
        cy.get('div#section_paused_op div.card').should('exist')
    } else {
        cy.get('div#section_paused_op p.no-ops').should('exist')
    }
})

因此，要在一种情况下测试类'card'的DIV元素的存在，首先必须使用find（）查找它。这是好的做法还是可以通过更好的方式做到？

Answer 1

正如您提到的最佳做法一样，我将回答这个问题，而不是代码建议：

我想说，您的测试应该基于触发这些条件，并确定知道在该测试期间某种状态应该处于什么状态。

什么使带有“卡片”类的DIV出现？有一个触发该条件的测试，然后断言该元素在那里。

什么使类“ no-ops”的P出现？有一个触发该条件的测试，然后断言该元素在那里。

仅因为页面上有内容并不意味着应该存在。