如何测试cypress中元素的子元素?

如何测试cypress中元素的子元素?,cypress,Cypress,如果我有这些元素 <div class="diffed-chunks"> <div class="diffed-chunk diffed-chunk--pending"></div> <div class="diffed-chunk">1</div> <div class="diffed-chunk">2</div> </div> 这是一个观点问题,但我喜欢的模式是 定义所

如果我有这些元素

<div class="diffed-chunks">
    <div class="diffed-chunk diffed-chunk--pending"></div>
    <div class="diffed-chunk">1</div>
    <div class="diffed-chunk">2</div>
</div>

这是一个观点问题,但我喜欢的模式是

  • 定义所需的数组
  • 按未测试的属性选择所有子级
  • 将实际数组与预期数组进行比较
预期常数=[
{
文本:“”,
类:“差异块差异块--挂起”,
},
{
正文:“1”,
类:“差异块”,
},
{
正文:“2”,
类:“差异块”,
},
];
const getText=el=>el.textContent.trim()
它('应该有预期的文本',()=>{
cy.get('.differed chunks div')。然后(els=>{
常量文本=[…els].map(getText)
expect(text).to.deep.eq(expected.map(x=>x.text))
})
});
const getClasses=el=>el.className
它('应该有类',()=>{
cy.get('.differed chunks div')。然后(els=>{
常量类=[…els].map(getClasses)
expected(classes).to.deep.eq(expected.map(x=>x.classes))
})
});

我开始键入答案,但现在我更仔细地看了看,我发现您希望能够选择索引中的哪个元素具有特定类或包含特定文本。。。是吗?@Maccurt是的,我想看到元素X有一个特定的类,元素Y有一个特定的文本。可能有多种情况,所以我想知道我是否可以做类似于
cy.get('@differed chunks').should('have.class',['differed-chunk--pending','','','')
老实说,我找不到更好的方法,因为我从来没有使用过.as()命令,所以我从你的帖子中了解了alias。我希望我能帮上忙,但我对你正在做的事没有异议。也许其他人会对此有更多的了解。很抱歉
cy.get('.diffed-chunks .diffed-chunk').as('diffed-chunks');
cy.get('@diffed-chunks')
  .eq(0)
  .should('have.class', 'diffed-chunk--pending');
cy.get('@diffed-chunks')
  .eq(1)
  .should('have.text', '1');
cy.get('@diffed-chunks')
  .eq(2)
  .should('have.text', '2')