返回父元素 - Cypress 中的 CSS 选择器答案

【问题标题】：Go back to parent element - CSS selector in Cypress返回父元素 - Cypress 中的 CSS 选择器
【发布时间】：2022-01-01 20:01:58
【问题描述】：

有人可以协助处理以下情况：

我必须检查 if 语句是否存在元素。由于不可能在 find 命令中使用 Xpath（使用 Xpath 运行时会引发语法错误）。

我的代码看起来：

cy.xpath(list)
    .eq(index)
    .then(($el1) => {
      cy.get('body').then((body) => {
        if (
          body.find(
            currentBase +
              currentTitle[index] +
              currentExtension
          ).length > 0
        ) {
     ...

其中 currentBase 是文本之前的 Xpath，currentText - 带有文本的元素，而 currentExtension 是连接以获取该文本元素下方的元素。我不想使用这些类，因为它们是动态的（而且，在不久的将来不能用一些独特的属性来改变）

DOM 看起来：

也就是说，很容易找到标记为img的元素，但是用下面的CSS，它就不起作用了

#structures img[src*="/static/media/image"].$('..').$('..').$('..') div:nth-child(2)

我想要的是，在元素下方找到 div 并带有文本 Element One

我做错了什么？或者赛普拉斯有没有其他方法可以一起使用 if 语句并在未找到元素时通过该步骤？提前谢谢你

【问题讨论】：

标签： css-selectors concatenation cypress

【解决方案1】：

你可以做这样的事情。这将为您提供位于Element One 下方的div 元素，它也是img 的父元素

cy.get('img[src*="/static/media/image"]').parent('div')

【讨论】：

它确实有效。非常感谢@Alapan Das
是的，只需等待几分钟，已经尝试过
@Alapan 只是为了理解。我在这里看到stackoverflow.com/questions/1014861/… 和其他地方没有办法使用 CSS 选择器到达父元素。有什么区别？
不确定我是否理解您的问题，但您可以阅读此docs.cypress.io/api/commands/parent。 parent 是一个 cypress 命令，旨在专门执行您正在寻找的任务。如果你想了解更多，我已经写了一篇关于这个主题的博客，如果你有兴趣，你也可以看看 - testersdock.com/cypress-parents-parent-children
啊，好的，我明白了。不，我与 cypress 没有任何关系，主要使用 Java 和 Python 进行自动化。我认为有一种方法可以做这样的 CSS 选择器。据我所知，这是不可能的。