还有过滤方法

• 把所有的红盒子
• 应用过滤器选择带有“绿色框”的
• 找到它的“黑匣子”的孩子

cy.contains('red box')    
  .filter(':contains("green box")')
  .find(':contains("black box")').click()

请注意，如果你像在你的例子中那样使用.find('black box')，它将寻找一个标记<black box>，而不是像<span>black box</span>那样寻找文本“black box”。
您需要弄清楚查询的每个部分所需的选择器。

• contains()为文本内容使用选择器
• find()使用<div>、<span>等标记
• :contains(...)修改了find()选择器，使其行为更像contains()

所以你举的例子可能是

cy.contains('green box')
  .parents(':contains("red box")')
  .find(':contains("black box")').click()

在第一个命令的情况下，.parent().get('black box')破坏了链，因为.get()总是从根元素开始-所以之前的命令不会影响它。
在第二个命令中，使用.parents()而不是.parent()，Cypress足够聪明，可以在它找到的所有父节点上执行.find()，

cy.contains('green box').parents().find('black box').click()

这里有一些非常好的遍历命令使用示例Cypress examples（v13.3.1）。
您也可以使用contains(selector, text)直接指定红色框

cy.contains(':contains("red box")', 'green box').find('black box').click()

在没有看到确切的HTML的情况下，其中一些包含假设，但是：
你应该使用cy.find()。cy.get()从根开始搜索元素，其中cy.find()（或cy.within()）从先前产生的元素中搜索。
此外，cy.parent()在DOM中只上升了一步。所以，如果你想要的父元素是一个以上的步骤，Cypress将无法找到你想要的元素。Instead, you can use cy.parents()遍历DOM直到找到匹配的元素。
假设一个HTML结构像这样：

<div>
  <div class="red">
    <div class="middle">
      <div class="black" />
      <div class="blue" />
    </div>
  </div>
  <div class="red">
    <div class="middle">
      <div class="black" />
      <div class="yellow" />
    </div>
  </div>
  <div class="red">
    <div class="middle">
      <div class="black" />
      <div class="green" />
    </div>
  </div>
</div>

然后，要获取具有.black的div，它也有.green的兄弟，您的代码看起来像这样：

cy.get('.green')
  .parents('.red')
  .find('.black')
  .click();

如果.green和.black元素是真正的兄弟元素，则可以是shorthanded with cy.siblings()

cy.get('.green')
  .siblings('.black')
  .click();