使用同一父级的表兄弟节点从父级中选择子元素

Question

我正在使用 TestCafe 选择器来选择元素。这是表弟孩子的复杂嵌套场景。

下面是 HTML，可以帮助您了解我上面提到的内容：

在图片中，我提到了1和2是具有孙子的父元素（具有相同的DOM）path，而另一棵树中同一父元素的孙子是<span title='John' /span>。我需要 的节点，path但需要链接，<span title='John' /span>因为所有父级都有相同的 DOM。

我不知道如何使用 TestCafe 解决这种情况。我必须使用 jQuery 吗？如果是，那么如何？我尝试了很多但无法弄清楚。

Answer 1

TestCafe API 足够智能来处理您的情况：

const JohnSelector = Selector('div.person-identity')
  .find('span.person-name')
  .withExactText('John');

const pathSelector = JohnSelector
  .parent('div.projects-project-role')
  .prevSibling('div.projects-project-role')
  .find('button svg path')
  .nth(1);

console.log(`${await JohnSelector.innerText}`);
console.log(`${await pathSelector.getAttribute("d")}`);