赛普拉斯检查一个元素是否具有特定的文本值答案

【问题标题】：Cypress check if one element has a certain text value赛普拉斯检查一个元素是否具有特定的文本值
【发布时间】：2020-09-15 06:46:51
【问题描述】：

我正在尝试设置我的第一个赛普拉斯测试，但我找不到如何查看我使用 cy.get() 命令获得的元素是否具有特定值。

也许我的方法不正确。这就是我想做的：

我有一个有两个日期的表格。提交表单后，后端有一些额外的验证。不能将两种日期形式选择为相同的日期（例如）。如果出现验证错误，我想在表单下方显示此错误。这将与 span 元素一起显示（至少 Material Ui 是这样做的）。

现在通过我的测试，我想获取所有 span 元素并查看其中一个是否有错误消息。

我该如何实现呢？

我试过cy.get('span').contains('Some error message')，但这似乎不起作用。

【问题讨论】：

标签： javascript reactjs cypress

【解决方案1】：

基于Cypress documentation你可以试试：

cy.get('span').should('have.text', 'Some error message')

【讨论】：

您好，感谢您的想法，创建此消息后我有了另一个想法。我在我的组件中添加了data-testId。现在我可以做类似cy.get('[error-message] > span').should('have.text', 'Some error message') 的事情，这很有效?。仍然感谢您的建议。
啊，我也用contain.text 尝试了你的建议，这有效并通过了测试。 have.text 似乎不起作用。

【解决方案2】：

一种方法是使用 each() 循环遍历所有 span 元素，然后您可以提取 innerText 并根据您的错误消息对其进行验证。

cy.get('span').each(($elm) => {
    cy.wrap($elm).invoke('text').then((text) => {
        if (text == "Error Message") {
            //Do Something
        }
        else {
            //Do Something
        }
    })
})

【讨论】：

您好，感谢您的回答。我如何能够在 if 条件中返回测试通过？
你可以在 if 里面添加一个断言，比如 expect(text).to.equal('Error Message') 或者写 return 来退出 if 块。
啊，是的，谢谢，以后会派上用场的。