赛普拉斯获取特定路径内的元素

Question

使用 Cypress 自动化一些测试，我发现了这个问题。

我们向客户提出了许多问题，这些问题将根据之前的答案一一出现。下一个问题（例如答案的类型）在显示之前将是未知的。我把这个留在这里作为一个例子，其中每个“div”（不是“rootDiv”）都是一个问题，并且它们仅在前一个得到响应时显示。

    <div class="rootDiv">
        <div class="type1">
           <div class="type1b">
              <button class="button1">
              <button class="button1">
           </div>
        </div>
        <div class="type2">
           <div class="type2b">
              <button class="button2">
              <button class="button2">
              <button class="button2">
              <button class="button2">
           </div>
        </div>
        <div class="type1">
           <div class="type1b">
              <button class="button1">
              <button class="button1">
           </div>
        </div>
        .
        .
        .
       <div class="typeX">
           <div class="typeXb">
              <button class="buttonX">
              <button class="buttonX">
              <button class="buttonX">
              <button class="buttonX">
           </div>
       </div>
    </div>

所以我面临的问题是：

1. 有没有办法访问“rootDiv”中的最后一个“div”，检查它的类并根据它点击任何按钮？
2. 有没有办法让最后一个“div”的按钮上写上“文本”？
3. 有没有办法拥有一个元素列表（在本例中为按钮）并遍历它们？

有很多解决方法，主要问题取决于如何获得这些元素

Answer 1

1. 有没有办法访问“rootDiv”中的最后一个“div”，检查它的类并根据它点击任何按钮？

可以访问“rootDiv”中的最后一个“div”：cy.get('.rootDiv div').last()。但是，检查类然后根据类的值执行操作是一个坏主意，因为它是conditional testing，而赛普拉斯并不是真的为此而生。不过，如果你真的需要这种态度（没有其他更好的方法），我认为是可行的。

1. 有没有办法让最后一个“div”的按钮上写上“文本”？

是的，可以获取最后一个 div 的“文本”。 cy.get('.rootDiv div').last().invoke('text').then((textOnTheButton) => {console.log(textOnTheButton})

3.有没有办法拥有一个元素列表（在这种情况下是按钮）并遍历它们？

要获得所有按钮，您只需要cy.get(button)。如果您想使用索引遍历所有这些，您可以使用 for 循环和eq()，但它可能不是所有情况下最好/最有效的解决方案。