使用行中的文本操作cypress中的元素

Question

我如何从下面的代码访问'switch__obj'使用的内容从行?

例如，我想用check()/uncheck()操作'switch__obj'，这是一个滑动条按钮，但在内容的帮助下找到它，有点像cy.get('row').contains('Text wherewith find that').find('.switch__obj').uncheck({force:true})...?

我尝试了parent()， parents()， find()， children()，但是我找不到它。

<div _ngcontent-iil-c662="" class="row">
<div _ngcontent-iil-c662="" class="col-10"><label _ngcontent-iil-c662="" for="chkOnlineBooking" class="label-bold">Allow patients to book appointments online</label></div>
<div _ngcontent-iil-c662="" class="col-2">
<div _ngcontent-iil-c662="" class="pull-right switch switch-small">
<div _ngcontent-iil-c662="" class="col-auto"><label _ngcontent-iil-c662="" class="o-switch"><input _ngcontent-iil-c662="" type="checkbox" ng-reflect-model="true" ng-reflect-is-disabled="false" ng-reflect-options="[object Object]" class="ng-untouched ng-valid ng-dirty"><span _ngcontent-iil-c662="" data-off="No" data-on="Yes" class="switch__obj"></span></label><label _ngcontent-iil-c662="" for="chkOnlineBooking"></label></div>
</div>
</div>
</div>

我希望我已经提供了所有必要的信息。谢谢你！注意:我使用这个代码和工作，但我想找到它基于文本，而不是与eq()选项cy.get('.switch__obj').eq(0).parent().find('input').uncheck({force:true})

Answer 1

使用contains()识别具有正确文本的行，指定.row作为要返回的元素。

然后直接在那一行中输入.find()。

cy.get('.row', 'Allow patients to book appointments online')
.find('input[type="checkbox"]')
.check()

您实际上可以省略[type="checkbox"]，但稍后回顾您的测试时它读起来更好-您知道.check()是正确的操作，而不是.click()。

Answer 2

你可以这样做:

cy.contains('div', 'Allow patients to book appointments online')
.parent() //Moves to parent div row
.within(() => { //scopes the commands within the above div row
cy.get('.switch__obj').click()
})

如果您想使用check命令，您可以这样做:

cy.contains('div', 'Allow patients to book appointments online')
.parent() //Moves to parent div row
.within(() => { //scopes the commands within the above div row
cy.get('input[type="checkbox"]').check()
})