当父元素具有CSS属性:DISPLAY:NONE时,Cypress如何断言元素可见
如何为其父元素具有隐藏CSS属性的元素编写Cypress可见断言?
我有以下HTML代码
<td class="item-total item-total-mobile-hidden">
<p class="mobile-show block-price-text">Total Price:</p>
<span class="price-total">
$699.99
</span>
</td>
当我编写以下cypress代码以断言价格元素可见时
Cy.get('.price-total').should('be.visible')
我收到此错误消息
重试超时:预期‘<;span.Price-Total>;’为‘可见’
此元素<;span.price-total>;不可见,因为其父元素<;div.item-total-price-mobile-show>;具有CSS属性:Display:None
我必须尝试在控制台上进行调试(将跨度放入变量$0)
这里显示了span元素为isVisible true,但我无法断言它。 我通过调用子元素上的文本尝试了以下操作,但也不起作用$0
<;SPAN CLASS=;价格合计>; 699.99美元 >; Cypress.dom.isVisible(0美元) 真
cy.get('.price-total').invoke('text')
.then((text)=>{
const divTxt = text;
expect(divTxt).to.be.visible; })
这不起作用,我收到以下错误,因为Cypress找不到隐藏的元素
重试超时:应找到元素:.Price-Total,但从未找到。
断言元素<;SPAN CLASS=";>;可见的最佳方式是什么?
解决方案
.price-total
css具有"display: none"
属性时可以重试:
cy.get('.price-total').should('not.have.css', 'display', 'none')
相关文章