使用柏树从复杂的层次结构中获取元素

Question

我是柏树的新手。最近，我试图在一个网站中获取文本变量，并将元素推送到一个数组中。但是，我无法正确获取元素位置。我尝试了不同的方法，如get(), find()，但仍然未能获得CypressError: Timed out retryimg: Expected to find element:'.nav-link pr-0 d-none d-lg-block>.langSelector', but never found it

这是我的html:

...
<div class="nav-link pr-0 d-none d-lg-block">
<div id="langSelector">
<a data-dir="AAA" href="/AAA/example"> AAA </a>
<a data-dir="BBB" href="/BBB/example"> BBB </a>
<a data-dir="CCC" href="/CCC/example"> CCC </a>
</div>
</div>
...

以下是我失败的尝试：

cy.get('.nav-link pr-0 d-none d-lg-block > .langSelector').find('>a').each(($el) => {
cy.wrap($el).invoke('text')
.then(text => {
exampleArray.push(text.trim())
})
})

另一个失败的尝试：

cy.get('div > .langSelector > a').each(($el) => {
cy.wrap($el).invoke('text')
.then(text => {
exampleArray.push(text.trim())
})
})

错误消息相同：CypressError: Timed out retryimg: Expected to find element:'.nav-link pr-0 d-none d-lg-block>.langSelector', but never found it任何想法都将是一个很大的帮助！万分感谢！

Answer 1

langSelector不是一个类，因此它不应该在选择器前面有.。它是一个id，所以应该用#来选择它。

尝试cy.get('#langSelector > a')

参考：

• 最佳实践

附带说明一下，最佳实践是在html中使用一个单独的属性来分配一个特定于测试的id(比如data tid、data cy等(，并为测试引用该id。这些信息也在上面的链接参考中。