如何使用 Cypress 获得同一类的第二个 div

Question

我有一个聊天机器人应用程序，我想用 Cypress 对其进行测试。我正在查看机器人是否正确响应客户端的案例。所以我点击后检查我应该得到一个具有类bot-message的 div 。

cy.get('.bot-message').should('have.text','I want to send invoice to my email')

CypressError: Timed out retrying: expected
[ <div.bot-message>, 3 more... ] to have text 
I want to send invoice to my email. , but the text was 
I want to see my profile.I want to see my invoices.
I want to send invoice to my email

这里的问题是 cypress 获取名为bot-message的类中的所有 div 。

所以我想要能够做的是说得到同一个类的第 3 个 div。如果情况并非如此，那么我想我应该为每个机器人消息 div 提供数据属性

Answer 1

使用eq获取元素数组中特定索引处的 DOM 元素。

来自API 文档：

此命令的查询行为与 .eq() 在 jQuery 中的工作方式完全匹配。它的行为也类似于 CSS 伪类 :nth-child() 选择器的行为。

cy.get('.bot-message')
  .eq(1) // to get 2nd element. array index (counting) starts from 0
  .should('have.text','I want to send invoice to my email');